微客导航 » 文章资讯 » vue实现组件之间传值功能示例

vue实现组件之间传值功能示例

2023-09-10 08:19:05 180

本文实例讲述了vue实现组件之间传值功能。分享给大家供大家参考，具体如下：

slot标签：

想向封装好结构的组件中插入内容，需要借助

在组件之中进行关联：如

模板中：

组件调用中：

注：如果只有slot上面每一定义name属性，则只能有一个slot

Vue.component('com',{
template:"#c"
})

父组件向子组件传值：props

父组件：

子组件：

child：{
template：'#chi'
props：['parentMsg']
}

子组件向父组件的传值：

vue只运行数据的单选传递，在子组件向父组件的传值中，需要事件触发

子组件：

methods:{
up(){
this.$emit('fn','msg')//主动触发fn方法，msg是需要传递的数据
}
}

父组件：

methods:{
getval(msg){//msg接收到的数据
this.msg=msg
}
}

希望本文所述对大家vue.js程序设计有所帮助。

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

返回顶部
3162201930
czq8825@qq.com

vue实现组件之间传值功能示例

热门推荐

随机推荐