小程序 - 組件通信 - 子傳父,代碼如下:
// 第一步:通過(guò)自定義事件的方式通知父組件
// components/music/index.js
Component({
/**
* 組件的屬性列表
*/
properties: {
name: String,
type: String
},
methods: {
onMusic () {
/*
*第一步:通過(guò)自定義事件的方式通知父組件
triggerEvent 指定事件名、detail對(duì)象和事件選項(xiàng) - 通知父組件
parentReceive自定義事件名、name: '雪落下的聲音'要傳遞過(guò)去的數(shù)據(jù)、事件選項(xiàng)有三個(gè)(見(jiàn)官網(wǎng))
*/
this.triggerEvent('parentReceive', {
name: '雪落下的聲音'
}, {})
}
}
})
<!--第二步:事件綁定 -->
<!--components/music/index.wxml-->
<view>music:{歌曲名稱(chēng):{{ name }},類(lèi)型:{{ type }}}</view>
<button bind:tap="onMusic">通知父組件</button>
<!--
第三步:在組件標(biāo)簽上綁定在子組件中自定義的事件“parentReceive”,通過(guò)回調(diào)函數(shù)的形式在父組件中進(jìn)行邏輯處理;
pages/index/index.wxml
-->
<f-music name="成都" type="2" bind:parentReceive="parentCallBack" />
// 第四步:在回調(diào)函數(shù)的事件對(duì)象中進(jìn)行數(shù)據(jù)接收
// pages/index/index.js
Page({
// 第四步:在回調(diào)函數(shù)的事件對(duì)象中進(jìn)行數(shù)據(jù)接收
parentCallBack (event) {
console.log(event)
}
})
https://github.com/xiaosi0707/wechat-miniProgram-demo/tree/master/child-parent

同學(xué)們聽(tīng)我說(shuō)