今天编程过程中，遇到一个问题就是vue 父组件传给子组件传值，子组件中watch第一次中监听不到，只有第二个数据变化才能检测到变化。经过各种尝试终于解决了这个问题

问题描述:

父组件中主要代码如下:

<more  :type="curTab"/>

子组件中关键代码如下:

props: {
    type: {
      type: String,
      default: ''
    }
  },
 watch中关键代码
 watch: {
    type: {
      handler (val, old) {
        this.settype()
      }
    }
  },

在debugger过程中发现父组件中curTab第一次传值，watch中监听不到。经过一番操作，终于解决这个问题，有两种解决这个问题的方法

方法一：加上参数immediate: true

经过查询官网原因，查到的watch默认最开始的数据不会执行回调，就是说不会进行监听数据的变化。

想要第一就进行回调，就像官网说的那样要加上immediate: true选项即可

方法二:延时解决

因为watch检测不到第一次的变化，那么我们可以让代码进行延时在进行赋值

moreClick () {
      let self = this
      self.curSelectTab = ''
       setTimeout(() => {
         self.curTab = '3'
       }, 50)
    }

是因为最开始old的值就是1

然后由于延时所以把curTab的值设为空字符串 ，然后延时传递过去，相当于有一些默认值 ，然后延时结束再传递过去1或者2 这个值，那么watch就检测到了Tab值的变化。x

结语

🔥一个人可以掌握知识，但只有与他人交流才能形成智慧。

🔥One person can acquire knowledge, but wisdom is formed only in the exchange with others.

🏆 我坚信人与人之间的差距是表面上是财富的差距，本质上是大脑中认知的差距，

我们下期再见。