微信小程序 action-sheet 反饋上拉菜單簡(jiǎn)單實(shí)例
更新時(shí)間:2017年05月11日 17:04:57 作者:xiaochun365
這篇文章主要介紹了微信小程序 action-sheet 反饋上拉菜單簡(jiǎn)單實(shí)例的相關(guān)資料,需要的朋友可以參考下
微信小程序 action-sheet 反饋上拉菜單簡(jiǎn)單實(shí)例
看下實(shí)現(xiàn)效果圖:
js
var items = ['item1', 'item2', 'item3', 'item4'] var pageObject = { data: { actionSheetHidden: true, actionSheetItems: items }, actionSheetTap: function (e) { this.setData({ actionSheetHidden: !this.data.actionSheetHidden }) }, actionSheetChange: function (e) { this.setData({ actionSheetHidden: !this.data.actionSheetHidden }) } } for (var i = 0; i < items.length; ++i) { (function (itemName) { pageObject['bind' + itemName] = function (e) { console.log('click' + itemName, e) } })(items[i]) } Page(pageObject)
wxml
<button type="default" bindtap="actionSheetTap">彈出action sheet</button> <action-sheet hidden="{{actionSheetHidden}}" bindchange="actionSheetChange"> <block wx:for-items="{{actionSheetItems}}"> <action-sheet-item class="item" bindtap="bind{{item}}">{{item}}</action-sheet-item> </block> <action-sheet-cancel class="cancel">取消</action-sheet-cancel> </action-sheet>
感謝閱讀,希望能幫助到大家,謝謝大家對(duì)本站的支持!
您可能感興趣的文章:
相關(guān)文章
Three.js實(shí)現(xiàn)雪糕地球的使用示例詳解
這篇文章主要為大家介紹了Three.js實(shí)現(xiàn)雪糕地球的使用示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-07-07微信小程序支付之c#后臺(tái)實(shí)現(xiàn)方法
這篇文章主要介紹了微信小程序支付之c#后臺(tái)實(shí)現(xiàn)方法的相關(guān)資料,希望通過(guò)本文能幫助到大家,讓大家實(shí)現(xiàn)這樣的功能,需要的朋友可以參考下2017-10-10Javascript基礎(chǔ)知識(shí)中關(guān)于內(nèi)置對(duì)象的知識(shí)
這篇文章主要介紹了Javascript基礎(chǔ)知識(shí)中關(guān)于內(nèi)置對(duì)象的相關(guān)知識(shí)的相關(guān)資料,需要的朋友可以參考下面小編薇大家?guī)?lái)的精彩文章2021-09-09關(guān)于JavaScript?中?if包含逗號(hào)表達(dá)式
這篇文章主要介紹了?關(guān)于JavaScript?中?if包含逗號(hào)表達(dá)式,有時(shí)會(huì)看到JavaScript中if判斷里包含英文逗號(hào)?“,”,這個(gè)是其實(shí)是逗號(hào)表達(dá)式。在if條件里,只有最后一個(gè)表達(dá)式起判斷作用。下面來(lái)看看文章的具體介紹吧2021-11-11