父组件
<template>
<div id="list">
父组件的值<input type="text" v-model="parentVal">
<div>
<child :inputData="parentVal"></child>
</div>
</div>
</template>
<script>
import child from '../../components/demo/child'
export default {
name: 'list',
components:{
child
},
data(){
return{
parentVal: 100,
}
},
}
</script>
子组件
<template>
<div id="childzj">
<p>child子组件</p>
<div>
子组件<input type="text" v-model="childVal">
</div>
</div>
</template>
<script>
export default {
name: 'childzj',
props: {
inputData: {
}
},
data() {
return {
childVal: this.inputData
}
},
watch: {
inputData(newVal){
this.childVal = newVal;
console.log(newVal)
}
}
}
</script>