本文摘自PHP中文网,作者青灯夜游,侵删。
下面Vue.js教程栏目给大家介绍一下vue2.0中子组件通过v-modal改变父组件中值的方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。
vue2.0中子组件通过v-modal改变父组件中的值
父组件代码:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | < template lang = "pug" >
p
p this is father
child(v-model="data")
</ template >
< script >
import child from "./childrenS.vue";
export default{
data(){
return {
data: [1, 2, 3]
}
},
components: {
child
},
watch: {
data(n, o){
console.log(n,o)
}
}
}
</ script >
|
子组件代码:
1 2 3 4 5 6 7 8 9 10 | < template lang = "pug" >
p this is child
</ template >
< script >
export default{
created(){
this.$emit("input",[4,5,6])
}
}
</ script >
|
效果如下:
阅读剩余部分
相关阅读 >>
vue路由守卫有哪三种类型
怎么用npm安装vue
vue哪一年出来的
vue前端ui框架有哪些?
4个很 nice 的vue router过渡动效,快来收藏!
vue架构是什么
在vue中怎么定义自定义组件
vue3.0和vue2.0的区别是什么?
vue组件中如何引入css文件
vue.use是什么呀?
更多相关阅读请进入《vue》频道 >>
人民邮电出版社
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者
转载请注明出处:木庄网络博客 » vue2.0子组件中怎么改变父组件中的值 ?