Vue將props值實時傳遞 並可修改

我們都知道props值是只讀的，子組件內不可直接修改，會報錯滴

但是很多時候這個值是需要子組件主動修改的，一般我們會使用this.$emit()去修改，但比較麻煩

下面這種方式可以實現：

1、父組件實時修改props值時，子組件可以接收到改變

2、子組件可主動修改該值

<div>{{RealValue}}</div>

  props: [ "value" ],
  watch: {
    value (v) {
      this.RealValue = v
    }
  },
  data () {
    return {
      RealValue: this.value
    }
  }

原理很簡單，就是使用一個RealValue作為實際顯示的參數，並且使用watch實時把value值傳給他

PS：這里的值是字符串格式，如果value是對象或者數組，watch處要寫成：

  watch: {
    value:{
       deep: true,
       handler(v) {
          this.RealValue = v
       }
    }
  },