父組件向子組件傳值遇到的問題

今天還遇到了這么一個問題，父組件向子組件傳動態值，然后子組件接收之后賦值給data，然而，當父組件的值變化時，子組件中data 的值說什么也不變。

原因： 子組件賦值給data 值時，就不會改變，要想解決這個問題，用watch 來進行監聽。

展示問題：

 

 解決的方法： 就是再watch 中監聽props 傳過來的值，然后再給data 里面的值賦值一遍（這個博主的詳細的解釋了監聽不同類型的props 值 ： https://blog.csdn.net/weixin_38098192/article/details/80447867）

 

props: {
    send: {
      default: 0,
      type: Number
    }
  },

data(){
  number:this,send  
},
watch: {
    send: function(newVal) {
      console.log(newVal);
      this.number = newVal; //一定要寫！！！
    }
  },

　　這個方法同樣可以解決父組件傳遞的異步數據，當數據還沒加載完成，就已經完成了和子組件的傳值，所以，加上watch 可以監聽到值的變化。

　　當異步數據傳遞時還有一個解決方法：父組件中的數據先做非空判斷，如果是空就不初始化子組件，等父組件拿到異步數據再初始化子組件

<nav-footer :send="num" v-if="num.length>0"></nav-footer>  //先判斷數據是否存在