v-model可以把表单数据传过来的值与代码中的值进行交互
<body> <div id="app"> <h1>{{message}}</h1> <input type="text" v-model="message"> </div> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script> var app = new Vue({ el: "#app", data: { message: "hello" } }) </script> </body>
我们定义了message的值,并且通过v-model传给input,那么input里边就会显示message的值
同理如果我们修改input里边的值,那么message的值也会随着改变,
现在我们修改input的值
发现h1的message也会随着修改
我们再来加一个方法,mess
这样当我们回车的时候,就会弹出message的值
发现三个地方的值都是一样的