Vue的应用—表单

在dom中我们是通过获取其dom节点然后.val来获取其值，.innerText来获取其文本，而在vue中是通过v-model实现双向数据绑定获取值

Object.defineProperty() 方法会直接在一个对象上定义一个新属性，或者修改一个对象的现有属性，并返回此对象。

Object.defineProperty(obj, prop, descriptor)

obj：要定义属性的对象。

prop：要定义或修改的属性的名称或 Symbol 。

descriptor：要定义或修改的属性描述符。

这里使用vue中的v-model指令实现表单中的双向数据绑定

1.首先是用户名和密码，这两个原理是一样的，v-model都要绑定一个数据模型，

用户名: <input type="text" v-model="username"><br>
密码: <input type="text" v-model="password"><br>

这样的话就会很繁琐，数据模型中的数据变量会越来越多，所以这里在数据模型中声明了一个对象，对象.username来获取数据模型中用户名的值，同理，对象.password来获取数据模型中密码的值，修改之后为：

用户名: <input type="text" v-model="user.username"><br>
密码: <input type="text" v-model="user.password"><br>

2.接下来是性别，原理和上面一样࿰