vue2用watch监听props属性

在Vue2中，可以使用`watch`选项来监听`props`属性的变化。

假设有一个组件`MyComponent`，其中有一个`props`属性`myProp`，需要监听它的变化：

Vue.component('MyComponent', {
  props: ['myProp'],
  watch: {
    myProp: function(newVal, oldVal) {
      console.log('myProp changed from ' + oldVal + ' to ' + newVal);
    }
  }
});

在上面的代码中，我们在组件的`watch`选项中定义了一个`myProp`的监听器。当`myProp`的值发生变化时，该监听器将被调用，并输出新旧值。

注意，如果`props`属性是对象或数组，需要使用深度监听来检测其内部属性的变化。可以在监听器中设置`immediate: true`选项，来在组件创建时立即调用监听器并执行初始化操作。

Vue.component('MyComponent', {
  props: {
    myProp: {
      type: Object,
      default: () => ({})
    }
  },
  watch: {
    myProp: {
      handler: function(newVal, oldVal) {
        console.log('myProp changed from ', oldVal, ' to ', newVal);
      },
      deep: true,
      immediate: true
    }
  }
});