关于使用watch监听函数的报错小坑需要注意！

1.关于使用watch监听函数的报错注意点

属性：Vue.js 监听属性 watch，我们可以通过 watch 来响应数据的变化。

代码：

export default {
  name: 'HelloWorld',
  props: {
    msg: String
  },
  data() {
    return {
      site: "菜鸟教程",
      url: "www.runoob.com",
      alexa: 1
    }
  },
  methods: {
    details: function () {
      return this.site + " - 学的不仅是技术，更是梦想！";
    },

    watch: {
      'alexa': {
        handler(nval, oval) {
          console.log("b.c: " + nval, oval);
        },
        deep: true //true 深度监听
      }
    }
  }
}

报错截图：

报错好像是说watch在引用组件中定义了是对象类型，是否要引用进来

我按照网上的教程复制代码进来还是提示这个错误信息， 后面想想好像我的watch方法的位置不太一样，于是就调整watch方法到methods方法前面去，就不会报错了，程序顺利运行下去

正确代码：

export default {
  name: 'HelloWorld',
  props: {
    msg: String
  },
  data() {
    return {
      site: "菜鸟教程",
      url: "www.runoob.com",
      alexa: 1
    }
  },
  watch: {
    'alexa': {
      handler(nval, oval) {
        console.log("b.c: " + nval, oval);
      },
      deep: true //true 深度监听
    }
  },
  methods: {
    details: function () {
      return this.site + " - 学的不仅是技术，更是梦想！";
    },


  }
}

运行效果：