微信小程序滑動選擇器的實現(xiàn)代碼
更新時間：2018年08月10日 14:48:05 作者：luozx207
這篇文章主要介紹了微信小程序滑動選擇器的實現(xiàn)代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
本文介紹了微信小程序滑動選擇器的實現(xiàn)代碼，分享給大家，具體如下：
實現(xiàn)微信小程序滑動選擇效果
在wxml文件中，用一個picker標簽代表選擇器，bindchange是用戶點擊確定后觸發(fā)的函數(shù)，index是picker自帶的參數(shù)，用戶點擊確定后，bindchange綁定的函數(shù)用.detail.value就可以訪問到。第一個選擇的index值為0，依次遞增。range要在page的data中先定義一個數(shù)組給它賦值，然后數(shù)組的值就會變?yōu)檫x擇器中的選項
<picker bindchange="bindPickerChange" value="{{index}}" range="{{array}}">
<view class='choseQuestion' >
{{choseQuestionBank}}
</view>
</picker>
js文件中對應的數(shù)據(jù)和函數(shù)如下
Page({
data:{
array:['全部','計算機網絡','算法','數(shù)據(jù)結構','linux'],
type:0,
choseQuestionBank:"點擊選擇"
},
bindPickerChange: function (e) {
var that=this
console.log('picker發(fā)送選擇改變，攜帶值為', e.detail.value)
this.setData({
type: e.detail.value,
choseQuestionBank: that.data.array[e.detail.value]
})
},
})
點擊確認選擇的時候，只要判斷一下this.data.type的值就可以實現(xiàn)不同的選擇了。
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關文章
微信小程序實現(xiàn)事件傳參與數(shù)據(jù)同步流程詳解
這篇文章主要介紹了微信小程序開發(fā)中實現(xiàn)事件傳參與數(shù)據(jù)同步的詳細流程，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習吧2022-10-10
本文主要介紹了使用JavaScript渲染頁面的方法,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,感興趣的小伙伴下面隨著小編來一起來學習吧2023-12-12
這篇文章主要為大家詳細介紹了JS實現(xiàn)骰子3D旋轉效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-10-10
這篇文章主要介紹了JS實現(xiàn)從連接中獲取youtube的key的方法,涉及javascript字符串操作的相關技巧,需要的朋友可以參考下2015-07-07
本文主要講解的是V8的技術，是V8的入門篇，主要目的是了解V8的內部機制，希望對前端，快應用，瀏覽器，以及nodejs同學有些幫助。這里不涉及到如何編寫優(yōu)秀的前端，只是對JS內部引擎技術的講解2021-06-06
js鎖屏解屏是通過對$.ajax進行封裝實現(xiàn)的,需要的朋友可以參考下2014-07-07
Bootstrap~多級導航(級聯(lián)導航)的實現(xiàn)效果【附代碼】
下面小編就為大家分享一篇Bootstrap~多級導航(級聯(lián)導航)的實現(xiàn)效果【附代碼】。小編覺得挺不錯。希望對大家有所幫助。一起跟隨小編過來看看吧2016-03-03
平移和縮放是查看圖像時常用的功能,我們可以放大圖像以查看更多細節(jié),進行圖像編輯,Dynamsoft Document Viewer是一個用于此目的的SDK,它為文檔圖像提供了一組查看器,在本文中,我們將演示如何使用它來平移和縮放圖像,需要的朋友可以參考下2024-08-08
關于BootStrap modal 在IOS9中不能彈出的解決方法(IOS 9 bootstrap modal ios
本文給大家介紹BootStrap modal 在IOS9中不能彈出的問題以及bootstrap datepicker 在bootstrap modal中不顯示問題的解決方案，非常不錯，需要的朋友參考下2016-12-12
本文主要介紹了Jquery Easyui驗證擴展，Easyui驗證，Easyui校驗，js正則表達式。具有一定的參考價值，下面跟著小編一起來看下吧2017-01-01