uniapp兄弟组件间传值的示例代码

父页面a.vue里引用组件b.vue和组件c.vue，组件b.vue和c.vue间传值的简单示例代码

父页面a.vue代码如下：

<template>
	<view>
		<testb></testb>
		<testc></testc>
	</view>
</template>

<script>
	import testb from '@/components/testb.vue'
	import testc from '@/components/testc.vue'
	export default {
		data() {
			return {
			}
		},
		components:{
			testb,
			testc
		}
	}
</script>

组件b.vue代码如下：

<template>
	<view>
		这是b组件<button type="default" @click="changeC">触发c组件全局事件，修改c组件的值</button>
	</view>
</template>

<script>
	export default {
		name:"testb",
		data() {
			return {
				
			};
		},
		methods:{
			changeC(){
				//使用uni.$emit触发全局事件，并传参
				uni.$emit("upData",10)
			}
		}
	}
</script>

组件c.vue代码如下：

<template>
	<view>
		这是c组件数据：{{num}}
	</view>
</template>

<script>
	export default {
		name:"testc",
		data() {
			return {
				num:0
			};
		},
		//全局事件在组件实例创建完成定义
		created() {
			uni.$on('upData',num=>{
				this.num = num;
			})
		}
	}
</script>