vue父子传值以及监听这个值，把值拿到子组件使用不报警告

1，父组件给到一个值，然后在子组件的标签里面用   ：传变量 = 父变量

你的子组件记得注册

<template>
    <div>
       <h1>我是父组件,我有一个数字：<span style="color:orange">{{num}}</span> 给儿子</h1>
       <Son :message="num"></Son>
    </div>
</template>

<script>
import Son from './son'
export default {
    data () {
        return {
            num:123
        }
    },
    components: {
        Son
    }
}
</script>

2，子组件呢，用一个props去接收父组件的值，然后具体格式看代码

<template>
    <div>
        我是son组件,父亲给了我：{{message}}
        <button @click="handleClick">点击显示</button>
    </div>
</template>

<script>
export default {
    data () {
        return {
            list:this.message
        }
    },
    props:["message"],
    // props: {
    //     message: {
    //         type: String,                 //可指定接收类型，如:Array.
    //         default:"this is default"     //可设置默认值
    //     }
    // },
    created () {
        console.log(this.message)
    },
    methods: {
        handleClick(){
            console.log(++this.list)
        }
    },
    watch: {
        "message":function(val){
            this.data=val
        }
    }
}

</script>

我在这里呢，想用这个值，但是报一个警告，因为不能直接使用，所以把他赋给了list。

但是怕传来的值发生改变怎么办？所以我给了初始值一个监听，更新初始值。