关于定义响应数据时行为不一致的解决方法 about vue-design HOT 7 CLOSED

//  检测到 getter, 不去触发它, 所以 val 没有值
if (!getter && arguments.length === 2) {
    val = obj[key]
}

// 由于 val 没有值,  此处 observe(val) 没有任何作用,  所以初始时 val 不具备响应性
let childOb = !shallow && observe(val)

set: function reactiveSetter (newVal) {
      // ...省略
      
     if (setter) {
        setter.call(obj, newVal)
      } else {
        val = newVal
      }

      // newVal 被观测, 具备响应性, 与初始时不一致
      childOb = !shallow && observe(newVal)
      dep.notify()
    }

 if (getter && !setter) {
  //   初始化：不触发用户getter所以无副作用，不深度观测
  //   重新赋值：进行深度观测，破坏一致性
 }
 if (getter && setter) {
    //   初始化：触发用户getter有副作用，深度观测
    //   重新赋值：进行深度观测，保证一致性
 }
 if (!getter && setter) {
    //   初始化：无用户getter无副作用，深度观测
    //   重新赋值：进行深度观测，保证一致性
 }
 if (!getter && !setter) {
    //   初始化：无用户getter无副作用，深度观测
    //   重新赋值：进行深度观测，保证一致性
 }

set: function reactiveSetter (newVal) {
      // 略
      if (setter) {
        setter.call(obj, newVal)
      } else {
        // 没有 setter, 所以值被赋值给了 val,
        val = newVal
      }
      // val  被深度观测了
      childOb = !shallow && observe(newVal)
      dep.notify()
    }

get: function reactiveGetter () {
     // 由于存在 getter,  所以 value 的值总是从 getter 中获得, 和 val 没有关系.
      const value = getter ? getter.call(obj) : val

     // 略
     return value
    }

const data = {}
const value = {getterProp: {a: 1}}
Object.defineProperty(data, 'getterProp', {
  enumerable: true,
  configurable: true,
  get: () => {
    return value.getterProp;
  },
  set: (newValue) => {
    value.getterProp = newValue;
  },
})

const ins = new Vue({
  data,
  watch: {
    'getterProp.a': () => {
      console.log('触发watch绑定的依赖')
    }
  }
})