日期選擇

<view class="section"><picker mode="date" value="{{date}}" start="1980-01-01" end="{{ dates2 }}" bindchange="StartDate"><view class="picker">開始日期: <text style="color:blue;">{{dates1}}</text></view></picker> </view> // 點擊日期組件確定事件 StartDate: function (e) {console.log("StartDate>>>" + e.detail.value)this.setData({dates1: e.detail.value}) }, data: {dates1: "2020-01-01", },

普通選擇器

<view class="section__title">普通選擇器：（普通數組）</view><picker bindchange="bindPickerChange" value="{{index}}" range="{{array}}"><view class="picker">當前選擇：{{array[index]}}</view> </picker> //普通選擇器： bindPickerChange: function (e) {console.log('picker發送選擇改變，攜帶值為', e.detail.value)this.setData({index: e.detail.value}) }, data:{//普通選擇器：（普通數組）array: ['選項1', '選項2', '選項3', '選項4'],index: 0,//默認顯示位置 },

普通選擇器 json 格式數組

<!--選擇器--> <view class="section"><view class="section__title">普通選擇器2：（普通json格式數組）</view><picker bindchange="bindPickerChange2" value="{{objectIndex}}" range="{{objectArray}}" range-key="name"><view class="picker">當前選擇：{{objectArray[objectIndex].name}}</view></picker> </view> data:{ //普通選擇器2：（普通json格式數組） objectArray: [{id: 0,name: '中國'},{id: 1,name: '美國'},{id: 2,name: '德國'},{id: 3,name: '法國'} ], objectIndex: 0,//默認顯示位置 }, //普通選擇器2： bindPickerChange2: function (e) {console.log('picker發送選擇改變，攜帶值為', e.detail.value)this.setData({objectIndex: e.detail.value}) },

總結

以上是生活随笔為你收集整理的微信小程序 选择器的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。