v-bind数据绑定
来源：2-9 class与style绑定
qq_一个人一個人_0
2018-11-29 17:46:40
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<div id="app">
<input type="radio" v-model="picked" :value="value">
<label>单选按钮</label>
<p>{{ picked }}</p>
<p>{{ value }}</p>
</div>
<script src="https://cdn.bootcss.com/vue/2.5.13/vue.js"></script>
<script>
var app = new Vue({
el: '#app',
data: {
picked: false,
value: 123
}
});
</script>
</body>
</html>老师，这个里面说是v-bind绑定了动态的数据，什么意思啊，为什么一点击单选按钮picked的值变成了和value一样的123呢？这是什么原理啊？
写回答
3回答
-
你好， v-model的主要是绑定数据的作用，这里绑定了vaule的值，在后面表单控件绑定的课程中，也会讲到，建议：同学可以按照步骤一步步的进行学习。
祝学习愉快！
0 -
好帮手慕糖
2018-11-30
同学你好，1、 v-model 绑定的 value 通常是静态字符串，比如：如下，`picked` 为空字符串，当选中时，`picked` 就字符串 "a"了，这是语法使用哦。
2、这里:value是动态改变了value的值，所以通过:value这个动态来更改v-model绑定的值。
祝学习愉快！
0h018-11-30 -
好帮手慕糖
2018-11-29
同学你好，：这个写法是v-bind的缩写，:value相当于v-bind：value；这里v-bind不是绑定数据的，是绑定特性的。另，v-model这个是绑定数据的，在稍后的课程中会有讲到，同学可以接着往下学习下哦。
祝学习愉快！
0h018-11-30
相似问题