本案例在调试过程中出现类型转换错误，v-model 绑定props 对象报错问题，均已经解决。
<body>
<div id="app">
<cpn :number="num" @numinput="numinput"></cpn>
</div>
<template id="inner">
<div>
{{number}}<br>
{{dnum}}<br>
<input type="text" :value="dnum" @input="numinput" >
</div>
</template>
</body>
<script>
const cpn={
template:"#inner",
props:{
number:Number
},
data(){
return{
dnum:this.number
}
},
methods:{
numinput(event){
this.dnum=event.target.value
this.$emit("numinput",this.dnum);
}
}
}
new Vue({
el:"#app",
data:{
num:2
},
components:{
cpn
},
methods:{
numinput(value){
value =parseInt(value)
this.num=value;
console.log(value)
}
}
})
</script>vue 父子通信，通过input改变父子值
最新推荐文章于 2023-09-23 15:00:00 发布
扫一扫
736
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
