W3Cschool
恭喜您成為首批注冊用戶
獲得88經(jīng)驗(yàn)值獎勵
底部彈起的操作按鈕組件
在 page.json 中引入組件
{
"usingComponents": {
"mp-actionSheet": "../../components/actionsheet/actionsheet"
}
}
<!--WXML示例代碼-->
<mp-actionSheet bindactiontap="btnClick" show="{{showActionsheet}}" actions="{{groups}}" title="這是一個標(biāo)題,可以為一行或者兩行。">
</mp-actionSheet>
Page({
data: {
showActionsheet: false,
groups: [
{ text: '示例菜單', value: 1 },
{ text: '示例菜單', value: 2 },
{ text: '負(fù)向菜單', type: 'warn', value: 3 }
]
},
close: function () {
this.setData({
showActionsheet: false
})
},
btnClick(e) {
console.log(e)
this.close()
}
})
屬性 | 類型 | 默認(rèn)值 | 必填 | 說明 |
---|---|---|---|---|
title | string | 否 | 標(biāo)題 | |
show-cancel | boolean | true | 否 | 是否顯示取消按鈕 |
cancel-text | string | 否 | 取消按鈕的文本 | |
mask-class | string | 否 | 背景蒙層的class | |
ext-class | string | 否 | ActionSheet額外的class | |
mask-closable | boolean | true | 否 | 點(diǎn)擊背景蒙層是否可以關(guān)閉ActionSheet |
mask | boolean | true | 否 | 是否顯示背景蒙層 |
show | boolean | false | 否 | 是否顯示ActionSheet |
actions | Array | false | 是 | ActionSheet的按鈕項(xiàng)的配置,每一項(xiàng)是包含text、value、type的Object,type的取值為warn和default,表示兩種樣式 |
bindclose | eventhandler | 否 | 點(diǎn)擊背后的mask關(guān)閉掉ActionSheet觸發(fā)的事件 | |
bindactiontap | eventhandler | 否 | 點(diǎn)擊ActionSheet的按鈕項(xiàng)觸發(fā)的事件,detail為{ value, index } |
名稱 | 描述 |
---|---|
title | 標(biāo)題區(qū)域slot |
Copyright©2021 w3cschool編程獅|閩ICP備15016281號-3|閩公網(wǎng)安備35020302033924號
違法和不良信息舉報電話:173-0602-2364|舉報郵箱:jubao@eeedong.com
掃描二維碼
下載編程獅App
編程獅公眾號
聯(lián)系方式:
更多建議: