uniapp 父子组件 兄弟组件 页面跳转传参

本文详细介绍了Vue中父子组件的通信方式,包括子组件通过`$emit`触发事件并传递参数,以及父组件如何监听并响应这些事件。同时,还讲解了在UniApp中兄弟组件间使用`uni.$emit`和`uni.$on`进行通信的方法。此外,还涵盖了在页面跳转中如何通过URL参数传递数据,并在目标页面的`onLoad`选项中获取这些参数。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

父子组件

子组件中写个方法 this.$emit里 第一个参数是事件名字 第二个是要传递的参数

props: ['title']

methods: {
		todata() {
			this.$emit('changename', 'lilili');
		}
	}

父组件中注册子组件 然后使用 子组件名字叫test @子组件里发送的事件 在父组件里绑定事件 就可以得到子组件里发送过来的值

:title是给子组件传值 子组件用 props接收 见上图

<test :title="myname" @changename="onname"></test>

兄弟组件

uniapp中用uni.$emit('事件名字','传递的参数') uni.$on('事件名字','实现对参数的处理 可以写一个方法')

页面跳转传参

uni.navigateTo({
				url: '../xx/xx?age=xx&name=xx'
			});

通过?xxx=xxx 来传 uni.navigator 传不了data

跳转到指定页面 options 里就是传递过来的参数

 onload(options){
       console.log(options)
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值