uniapp小程序父子组件传值

uniapp小程序父子组件传值

1、子向父传递

**子组件传值的写法**
// 保存
save() {
	let labelsList = this.newSkillList.filter(item =>item.actives == true)
	// 向上个页面传递labelsList
		uni.$emit('save', labelsList)
	//返回上一页
		uni.navigateBack({})
	}

**父组件接收的写法**
	onShow() {
		let self = this
		uni.$on('save', res => {
			self.labelsList = res
		})
	},
	
	onUnload() {
		// 移除监听事件  
		uni.$off('save');
	},

2、父向子传递数据

**父组件传值的写法**
// 跳转到选择技能页面
    let self = this
	uni.navigateTo({
		url: "./skillSelect",
			success: (res) => {
              // 通过eventChannel向被打开页面传送labelList对象或数组
				res.eventChannel.emit('datas', self.labelList)
			}
   })

**子组件接收的写法**
  onLoad() {
    let self = this
    const eventChannel = self.getOpenerEventChannel();
	// 监听datas事件，获取上一页面通过eventChannel传送的大量数据
		eventChannel.on('datas', (data) => {
			self.info = data
			console.log('拿到父组件的数据是', self.info)
		})
  },