V-MODEL 是VUE 的一個指令,在input 控件上使用時,可以實現雙向綁定。
通過看文檔,發現他不過是一個語法糖。
實際是通過下面的代碼來實現的:
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="vue/vue.js"></script> </head> <body> <div id="app-6"> <input :value="person.name" @input="person.name = $event.target.value"> <input :value="person.age" @input="person.age =$event.target.value"> {{person}} </div> <script type="text/javascript"> var app =new Vue({ el: '#app-6', data:{ person:{name:"ray",age:19} } }) </script> </body> </html>
通過綁定綁定INPUT事件來更新對應對象的值。