Vue---单向数据

举例：

App.vue文件

<template>

  <divclass="mainbox">

    <div>father的数据-----{{msg}}</div>

   <tbox:msg="msg"></tbox>

  </div>

</template>

<script>

importtboxfrom"./components/tbos.vue"

export default{

  data(){

    return{

      msg:"hello"

    }

  },

  components:{

    tbox,

},

}

</script>

tbos.vue文件

<template>

    <div>

        <div>child的数据---{{msg}}</div>

        <button@click="change">change</button>

    </div>

</template>

<script>

// import axios from "axios"

export default{

    props:["msg"],

    data() {

        return{

        }

    },

    methods:{

        change(){

            this.msg="666666"

        }

    },

     mounted(){

    }

}

</script>

tbos和app文件都是用的同一个变量，但是我们修改tbos文件中的变量值时，app文件的值并没有发生变化，这就是单向数据绑定