举例:
App.vue文件
<template>
<div class="mainbox">
<div>father的数据-----{{msg}}div>
<tbox :msg="msg">tbox>
div>
template>
<script>
import tbox from "./components/tbos.vue"
export default {
data(){
return{
msg:"hello"
}
},
components:{
tbox,
},
}
script>
tbos.vue文件
<template>
<div>
<div>child的数据---{{msg}}div>
<button @click="change">changebutton>
div>
template>
<script>
// import axios from "axios"
export default {
props:["msg"],
data() {
return {
}
},
methods: {
change(){
this.msg="666666"
}
},
mounted(){
}
}
script>
tbos和app文件都是用的同一个变量,但是我们修改tbos文件中的变量值时,app文件的值并没有发生变化,这就是单向数据绑定