绑定 value 到 Vue 实例的一个动态属性上

来源:互联网 发布:linux配置代理 编辑:程序博客网 时间:2024/06/06 08:28

在我第一次看到这部分的知识的时候有点懵。
具体的懵在vm.a等地方。
代码如下:

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>绑定到value</title>    <script src="vue.js"></script></head><body><div id="example">    <div>当选中是为a,未选中时为b。</div>    <input            checked="checked"            id="inp"            type="checkbox"            v-model="toggle"            <!--此处的ab都是动态的属性,需要在data中声明。-->            v-bind:true-value="a"            v-bind:false-value="b"    >    <label for="inp">{{toggle}}</label>    <p>toggle:{{toggle}}</p>    <div v-on:click="toggleFn">点击判断vm.toggle的值</div></div><script>  var vm= new Vue({        el:'#example',        data:{            toggle:"b",            //此处声明a、b            a:"aa",            b:"bb"        },          methods: {//看一下vm.toggle值的变化。                if (vm.toggle === vm.a) {                    alert(vm.a)                }else if(vm.toggle===vm.b){                 alert(vm.b)                }            }    })</script></body></html>

此外,出现在v-model=”“的值,都应在new Vue({data:{}})中声明。

原创粉丝点击