小米申請“MI CARE”、“CARE MI”商標,手機保障服務已上線
阿新 • • 發佈:2021-05-15
- 建立子元件
- 父頁面引入子元件
在父頁面的json中新增元件
"usingComponents": {
"custombar": "../../components/custombar/custombar"
},
在父頁面的wxml中新增元件
<custombar></custombar>
- 父頁面向子元件傳值
父頁面的wxml中在元件標籤上直接寫需要傳遞的值
<custombar title="hello"></custombar>
在子元件的js中,向properties新增接收傳值的屬性
// components/custombar.js
Component({
/**
* 元件的屬性列表
*/
properties: {
title: String
},
})
子元件的wxml中將傳進來的值展示
<text>{{title}}</text>
- 元件的自定義事件
子元件新增點選事件
<view class="button" bindtap="shareClick">點選事件</view>
點選事件裡註冊自定義事件 this.triggerEvent(“myevent”, {data:‘子元件像父頁面傳遞的引數’});
Component({
...
/**
* 元件的方法列表
*/
methods: {
shareClick: function(e) {
console.log("shareClick");
this.triggerEvent("shareClick", {data: 'share'});
},
}
})
在父頁面引入的子元件標籤上繫結自定義事件
<custombar bind:shareClick="shareClick2" title="分享"/>
父頁面處理子元件傳遞過來的引數
Page({
...
shareClick: function(e) {
console.log(e.detail);
console.log('shareClick');
}
})