700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > DropdownMenu 下拉菜单的使用

DropdownMenu 下拉菜单的使用

时间:2021-03-17 08:58:42

相关推荐

DropdownMenu 下拉菜单的使用

官方例子 :Vant Weapp - 轻量、可靠的小程序 UI 组件库

官方的代码演示不够详细,这里记录一下,效果图

注意事件是写在<van-dropdown-item> 里,如:bind:opened="onOpenDropdown"

wxml:

<view class=" custom-flex-row-start van-hairline--bottom"><text>仓库:</text><van-dropdown-menu active-color="#4859E5" ><van-dropdown-item options="{{ option }}" title="{{menuText}}" title-class="color-blue" bind:opened="onOpenDropdown" bind:change="onChangeDropdown" /></van-dropdown-menu></view>

js:

const app = getApp()Page({data: {menuText: '请选择',option: [{ text: 'aaa', value: 0 },{ text: 'bbbb', value: 1 },{ text: 'cccc', value: 2 },],},//打开下拉菜单--获取仓库接口onOpenDropdown(){let url = "path"let data = {sessionKey: wx.getStorageSync('sessionKey'),}app.wxRequest('get',url,data,(res)=>{console.log(res)},(err)=>{console.log(err)})},//下拉菜单发生变化onChangeDropdown(event){// console.log(event.detail)let selValue = this.data.option[event.detail].textthis.setData({menuText: selValue})},})

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。