# 4、属性绑定 # 3.5属性绑定 ## 1\. Vue如何动态处理属性? ● v-bind指令用法 ~~~ <a v-bind:href='url '>跳转</a> ~~~ ● 缩写形式. ~~~ <a :href='url'>跳转</a> ~~~ ## 2.v-model的低层实现原理分析 ~~~ <input v-bind:value= "msg" v-on: input= "msg=$event.target.value"> ~~~ ~~~ <div id="app"> // v-bind:value 渲染数据 v-on: input 触发事件 <input type="text" v-bind:value="msg" v-on: input=' handle'> <input type="text" v-bind:value= "msg" v-on: input= ' msg= $event.target.value ' > </div> <script type="text/javascript" src="js/vue.js"></script> <script type="text/javascript"> /* v-model指令的本质 */ var vm = new Vue({ el:‘ #app', data: { msg: ' hello' }， methods: { handle: function(event){ //使用输入域中的最新的数据覆盖原来的数据 this.msg = event. target.value; } } }) ~~~