代碼如下，預(yù)期功能是輸入為空的情況下提交按鈕無法點(diǎn)擊，使用計(jì)算屬性返回布爾變量進(jìn)行控制，但是實(shí)際使用時(shí)有值的情況下也無法點(diǎn)擊，是哪里出了問題呢
<!DOCTYPE html>
<html>
<head>
??? <meta charset="UTF-8">
??? <title>todolist</title>
??? <script src="vue.js"></script>
</head>
<body>
<div id="root">
???? <div>
???? <input v-model="inputValue"/>
???? <button disabled="loginId" v-on:click="handleClick">Enter</button>
?? ? </div>
???? <ul>
???? <li v-for="(item,index) of list":key="index">
???? {{item}}
???? </li>
???? </ul>
</div>
<script>
??? new Vue({
??????? el: '#root',
??????? data:{
??????? inputValue:'',
??????? list:[]
??????? },
??????? methods:{
??????? handleClick:function(){
??????? this.list.push(this.inputValue)
??????? inputValue=''
??????? }
??????? },
?? ??? ?computed: {
??????? isLogin() {
??????? return !!inputValue
??? }
}
??? })
</script>
</body>
</html>
2018-05-14
<!DOCTYPE html>
<html>
<head>
? ? <meta charset="UTF-8">
? ? <title>todolist</title>
? ? <script src="vue.js"></script>
</head>
<body>
<div id="root">
? ? ?<div>
? ? ?<input v-model="inputValue"/>
? ? ?<button :disabled="!inputValue" v-on:click="handleClick">Enter</button>
? ? ?</div>
? ? ?<ul>
? ? ?<li v-for="(item,index) of list" :key="index">
? ? ?{{item}}
? ? ?</li>
? ? ?</ul>
</div>
<script>
? ? new Vue({
? ? ? ? el: '#root',
? ? ? ? data:{
? ? ? ? inputValue:'',
? ? ? ? list:[]
? ? ? ? },
? ? ? ? methods:{
? ? ? ? handleClick:function(){
? ? ? ? this.list.push(this.inputValue)
? ? ? ? inputValue=''
? ? ? ? }
? ? ? ? }
? ? });
</script>
</body>
</html>
2018-05-14
<!DOCTYPE?html><html><head>????<meta?charset="UTF-8">????<title>todolist</title>????<script?src="vue.js"></script></head><body><div?id="root">?????<div> ?????<input?v-model="inputValue"/> ?????<button?:disabled="!inputValue"?v-on:click="handleClick">Enter</button>?????</div>?????<ul>?????<li?v-for="(item,index)?of?list"?:key="index">?????{{item}}?????</li>?????</ul></div><script>????new?Vue({????????el:?'#root',????????data:{ ????????inputValue:'', ????????list:[]????????},????????methods:{ ????????handleClick:function(){ ????????this.list.push(this.inputValue) ????????inputValue='' ????????}????????}????});</script></body></html>沒用computed,這樣就可以了.