上篇文章我们将vue的部分指令说了一下，可见Vue入门（二），接下来我们来研究一下剩下的v-model、v-on、v-bind三个指令。
首先我们来说v-model，v-model是为了实现表单输入和应用状态之间的双向绑定，我们通过一个例子来学习一下。
我们通过浏览器打开html页面可看到页面出现一个input框，值为“你好”，为了证明它们之间已经双向绑定，我们可以通过改变message的值来实现，请打开开发者工具，然后输入app.message = "测试"后回车，可以看到input框值已经变成“测试”。
接下来我们学习一下v-on指令，我们可以通过它添加一个事件监听器，通过它调用Vue实例中的方法，我们通过一个例子来学习一下。
我们通过浏览器打开html页面，可以看到页面如下图所示，然后我们点击button后input的值会变成“测试”，如图所示。（注：v-on可绑定多个事件）
接下来我们学习最后一个指令v-bind吧，它用于绑定数据和元素属性，比如可以绑定style、class、href，我们拿href学习一下。
跳转到百度
我们通过浏览器打开html页面，可以看到一个a链接，点击后进入百度网址。如此就可以证明数据和元素属性已经绑定成功。
上面就是这三个指令的所有内容了，欢迎大家评论点赞，如有问题可私信咨询。
| 留言与评论（共有 0 条评论） “” |
