vue实例方法数据

vm.$watch(expOrFn, callback, [options])

• 参数

  • {string | Function} expOrFn
  • {Function | Object} callback
  • {Object} [options]
    • {boolean} deep
    • {boolean} immediate

• 返回值 {Function} newwatch

• 用法
  观察 Vue 实例上的一个表达式或者一个函数计算结果的变化. 回调永汉得到的参数为新值和旧值. 表达式只接受监督的键路径

• 示例

  // 键路径
  vm.$watch('a.b.c', function(newVal, oldVal) {})
  
  // 函数
  vm.$watch(
    function() {
      // 表达式 `this.a + this.b` 每次得出一个不同的结果时
      // 处理函数都会被调用。
      // 这就像监听一个未被定义的计算属性
      return this.a + this.b
    },
    function(newVal, oldVal) {
      // 做点什么
    }
  )

  vm.$watch 返回一个取消观察函数, 用来停止触发回调

  var unwatch vm.$watch('a', cb)
  // 取消观察
  unwatch()

• 选项: deep
  为了发现对象内部值的变化, 可以在选项参数中指定 deep: true 将立即以表达式的当前值触发回调:

  vm.$watch('a', callback, {
    immediate: true
  })
  // 立即以 'a' 的当前值触发回调

  注意在带有 immediate选项时, 不能再第一次回调时取消侦听给定的 property

  // 这会导致报错
  var unwatch = vm.$watch(
    'value',
    function() {
      doSomething()
      unwatch()
    },
    { immediate: true }
  )

  如果想在会调内部调用一个取消侦听的函数, 应该先检查其函数的可用性

  var unwatch = vm.$watch(
    'value',
    function() {
      doSomething()
      if (unwatch) {
        unwatch()
      }
    },
    { immediate: true }
  )

vm.$set(target, propertyName/index,value)

• 参数:
  • {Object | Array} target
  • {string | number} propertyName/index
  • {any} value
• 返回值: 设置的值
• 用法: 这是全局 Vue.set 的别名

vm.$delete(target, propertyName/index)

• 参数:
  • {Object | Array} target
  • {string | number} propertyname/index
• 用法: 这是全局 Vue.delete 的别名