computed和watch使用

一、computed用法

• 初始化显示的属性数据发生变化的时候调用；
• 计算属性不在 data 中，它是基于data 或 props 中的数据通过计算得到的一个新值，这个新值根据已知值的变化而变化；
• 在 computed 属性对象中定义计算属性的方法，和取data对象里的数据属性一样，以属性访问的形式调用；
• 如果 computed 属性值是函数，那么默认会走 get 方法，必须要有一个返回值，函数的返回值就是属性的属性值；
• computed 属性值默认会缓存计算结果，在重复的调用中，只要依赖数据不变，直接取缓存中的计算结果，只有依赖型数据发生改变，computed 才会重新计算；
• 在computed中，默认只有get方法，没有set方法；

 【遇到的问题】

1、push方法不能调用computed里的pictureDate的set方法，如果不对数组进行变化，比如：map函数，可以直接写this.pictureDate = this.pictureDate

 2、当文件上传success方法，pictureData发生变化时，执行set方法时，先转成stringJson的形式，执行get方法后，又转成list形式了，这样做的目的是，表单绑定的v-model的值是要stringJson的，但是实际上组件显示图片，他是要list类型的

二、watch用法

• 主要用来监听某些特定数据的变化，从而进行某些具体的业务逻辑操作，可以看作是 computed 和 methods 的结合体；
• 可以监听的数据来源：data，props，computed内的数据；
• watch支持异步；
• 不支持缓存，监听的数据改变，直接会触发相应的操作；
• 监听函数有两个参数，第一个是最新的值，第二个参数是输入之前的值，顺序是新值，旧值。