绑定 value 到 Vue 实例的一个动态属性上
绑定Value到VUe实例的动态属性。
·
在我第一次看到这部分的知识的时候有点懵。
具体的懵在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"
<!--此处的a、b都是动态的属性,需要在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:{}})中声明。
更多推荐
已为社区贡献23条内容
所有评论(0)