uniapp 如何做父子组件间的通讯

 1.不能再uniapp使用vue 组件传值的方式

Tip: 父组件获取不到子组件传过来的值，但能触发父组件监听的方法

子组件代码：
close() {
				this.$emit('close',99)
			},

父组件代码：
<com-search v-if="isSearch" @close="handleClose()" ></com-search>
handleClose(data) {
	this.isSearch = false
	console.log(this.isSearch);  //触发了父组件监听的方法
	console.log('handleClose',data); // 为undefined  
},

 效果图：

2.使用uni.$emit()和uni.$on() 进行页面间通讯

自定义事件 uniapp
自 HBuilderX 2.0.0 起支持 uni.$emit、 uni.$on 、 uni.$once 、uni.$off ，可以方便的进行页面的通讯 ，触发的事件都是 App 全局级别的，跨任意组件，页面，nvue，vue 等。事件详情

具体如何使用呢？我们假设一个场景，进入app,是未登陆状态，需要在我的页面点击登陆，进入登陆页面进行登陆。登陆成功之后，返回到我的页面，实时显示登陆后的用户信息。

监听事件
首先，在我的页面监听事件。

复制代码// 我的页面    
onLoad(){    
    // 监听事件    
    uni.$on('login',(usnerinfo)=>{    
        this.usnerinfo = usnerinfo;    
    })    
},    
onUnload() {    
    // 移除监听事件    
        uni.$off('login');    
    },

因为事件监听是全局的，所以使用 uni.$on ，需要使用 uni.$off 移除全局的事件监听，避免重复监听。

触发事件
进入登陆页面，触发事件

复制代码// 登陆页面    
uni.$emit('login', {    
                avatarUrl: 'https://img-cdn-qiniu.dcloud.net.cn/uploads/nav_menu/10.jpg',    
                token: 'user123456',    
                userName: 'unier',    
                login: true    
            });

使用 uni.$emit 触发事件后，对应的 uni.$on 就会监听到事件触发，在回调中去执行相关的逻辑。

更多使用场景
以上只是一个简单的场景应用。而我们开发中会遇到很多页面间通讯场景，如：

vue 与 nvue，nvue 与 vue 间的通讯
tabbar 页面之间的通讯
父页面与多级子页面间的通讯
基本上述场景均可以实现，本质上就是一个页面通知另一个面我发生了变化，你需要处理一下。绝大部分页面的通讯都可以使用 uni.$emit、 uni.$on 、 uni.$once 、uni.$off 四个事件完成。

Tips

如果页面没有打开，将不能 注册监听事件 uni.$on 和 uni.$once 。
一次性的事件，直接使用 uni.$once 监听，不需要移除。