1.双向绑定:

什么是单向绑定:只能将程序中的修改更新到页面中。但是无法将页面中的更改，更新回程序中。

只能从Model-> View 不能从View -> Model

比如: {{}}v-text   :等等都是单向绑定

比如:

结果:变量中的值可正常显示在文本框中

但是文本框内容修改，变量的值不会改变

什么是双向绑定:即能将程序中的修改更新到页面中，又能将界面中的修改，反向更新会程序中

何时:只要希望通过表单元素的修改，来更改程序的内容时。——只要绑定表单元素，都用双向绑定。

如何：不要用:， 要用v-model:属性名="变量"

原理: v-model其实就是自动为表单元素绑定了oninput或onchange事件。在这些内容更改事件中，自动修改当前Vue对象中的模型变量。

普通绑定为什么不能更新程序中的数据：因为没有自动添加事件，导致界面上更改，Vue框架不知道，自然就无法更近模型变量。

其它表单元素的双向绑定:

1.单选按钮radio: 要绑定checked

不绑定value，因为radio中的value是写死的，固定不变的。等着被选择。

绑定checked:因为是否选中radio，取决于checked属性的值。用户更改选中项，改的也是checked属性值。——radio只能绑定v-model:checked="变量"

绑定时:

<input type="radio"name="sex" value="1" v-model:checked="变量"

<input type="radio"name="sex" value="0" v-model:checked="变量"  "变量==值"

小脾气: v-model在radio中：

从程序绑定到页面时: 会自动用checked后绑定的变量值和当前radio写死的value值做比较，返回bool值决定当前radio是否选中。时不用自己在checked后写完整条件！只写一个变量名即可！

改变选中状态时，v-model会将选中的radio的写死的value值更新回程序中绑定的变量上

2.单个checkbox绑定: 也绑定checked属性

<input type="checkbox" v-model:checked="isAgree"

3. select元素绑定:绑定的是select元素整体的value属性

因为，无论选择了哪一个option，当前选中项的值都 变成select元素的value属性值。

如何:

                     ... ...

原理:

当从Model->View绑定时:用变量的值和每个option的value做比较，按个相等，就选中哪一个 当修改select下的选中项后，将当前选中的option的value值更新回变量去

其实，以上绑定都有一个共同的简写:只写v-model即可，可省略:value  :checked等。v-model会个识别元素中起决定作用的可变的属性，自动绑定。

watch监控机制:

什么是: Vue中的watch监控机制可监控vue所有模型变量的变化。只要模型变量变化，就自动触发一个同名的函数。在函数中可调试变量的值或执行实时操作

何时:希望只要变量的值变化，就立刻做一件事儿时

如何: new Vue({

                el:"#app", //找要监控的整个页面空间

    data:{

变量1:值1

                }, //所有页面需要的模型变量

methods:{ ... }, //所有事件处理函数和一些自定义函数

created(){ ... }, //当new Vue()对象加载完自动执行

watch:{ //定义监控变量的函数

变量1(){//必须同名，只有同名的函数，才能监视同名的变量

执行一切js或vue的操作

  }

                }

             })