VUE基础:循环、判断、点击事件及表单验证双向绑定
实现组件双向数据绑定在上一节中最后的示例使用的是Vue 0版本中的 .sync 实现数据双向绑定。
v-model 是 vue 提供的用来对表单控件做数据双向绑定的指令。它可以根据用户的输入动态改变其绑定的值，同样可以根据绑定值的改变来操作页面 DOM 的更新。
视图交互变化(input) - 数据model变更的双向绑定效果。v-model是什么？怎么使用？ vue中标签怎么绑定事件？可以实现双向绑定，指令(v-class、v-for、v-if、v-show、v-on)。vue的model层的data属性。
Vue的双向数据绑定的原理相信大家也都十分了解了，主要是通过 Object对象的defineProperty属性，重写data的set和get函数来实现的，这里对原理不做过多描述，主要还是来实现一个实例。
如何使用vuexstate及mapState
state：vuex的基本数据，用来存储变量。geeter：从基本数据(state)派生的数据，相当于state的计算属性。mutation：提交更新数据的方法，必须是同步的(如果需要异步使用action)。
通过映射函数mapState、mapGetters、mapActions、mapMutations，可以将vuex.store中的属性映射到vue实例身上，这样在vue实例中就能访问vuex.store中的属性了，便于操作vuex.store。
在vue组件中访问 注：由于不能修改store数据，所以一般不建议在data中访问store的数据，因为它没有缓存效果，一般在计算属性中获取state数据。
State中的辅助函数 mapState 当一个组件需要获取多个状态时候，将这些状态都声明为计算属性会有些重复和冗余。
搭建完成后的文件目录是这样子的 首先使用npm install --save-dev vuex 把vuex添加到依赖，接下来就是如何在组件中使用vuex，大体上来说有以下两种形式。
显示界面：其中state就是仓库store，东西都存在这里。从state中取数据，使用Lodash比较方便，语法如下：也可以使用vuex的getters，语法；官方文档还结束通过属性访问，通过方法访问等。
Vue中v-model基本使用
1、Vue中使用v-model指令来实现表单元素和数据的双向绑定。监听用户的输入，然后更新数据。
2、默认情况下，一个组件的 v-model 会使用 value prop 和 input 事件。但是诸如单选框、复选框之类的输入类型可能把 value 用作了别的目的。
3、v-model 是 Vue2 中唯一支持双向绑定的指令，用于表单控件绑定，但不代表它只能用在表单控件之上。在文档 使用自定义事件的表单输入组件 一节中提到了， v-model 其实是个语法糖。
4、v-model 是 vue 提供的用来对表单控件做数据双向绑定的指令。它可以根据用户的输入动态改变其绑定的值，同样可以根据绑定值的改变来操作页面 DOM 的更新。
5、v-model的基础用法 v-model本质上不过是语法糖，可以用v-model指令在表单、textarea及元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。
6、Vue官方-表单输入绑定 v-model指令，绑定文本框的内容，实现双向数据绑定。v-model指令，绑定多行文本框的内容，实现双向数据绑定。绑定一组单选框，每个单选框指定相同的name属性。下拉框，绑定一个数组。