亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

微信小程序多項(xiàng)選擇器checkbox

 更新時(shí)間:2022年07月11日 10:12:07   作者:qq_45973003  
這篇文章主要為大家詳細(xì)介紹了微信小程序多項(xiàng)選擇器checkbox,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下

本文實(shí)例為大家分享了微信小程序多項(xiàng)選擇器checkbox的具體代碼,供大家參考,具體內(nèi)容如下

第一的話就是我們的相關(guān)的布局文件:

<view class="container">
? <view class="page-body">
? ? <view class="page-section page-section-gap">
? ? ? <view class="page-section-title">默認(rèn)樣式</view>
? ? ? <label class="checkbox">
? ? ? ? <checkbox value="cb" checked="true"/>選中
? ? ? </label>
? ? ? <label class="checkbox">
? ? ? ? <checkbox value="cb" />未選中
? ? ? </label>
? ? </view>
??
? ? <view class="page-section">
? ? ? <view class="page-section-title">推薦展示樣式</view>
? ? ? <view class="weui-cells weui-cells_after-title">
? ? ? ? <checkbox-group bindchange="checkboxChange">
? ? ? ? ? <label class="weui-cell weui-check__label" wx:for="{{items}}" wx:key="{{item.value}}">
? ? ? ? ? ? <view class="weui-cell__hd">
? ? ? ? ? ? ? <checkbox value="{{item.value}}" checked="{{item.checked}}"/>
? ? ? ? ? ? </view>
? ? ? ? ? ? <view class="weui-cell__bd">{{item.name}}</view>
? ? ? ? ? </label>
? ? ? ? </checkbox-group>
? ? ? </view>
? ? </view>
? </view>
??
</view>

然后的話就是我們的小程序的邏輯部分:

Page({

? // 在我們的這個(gè)位置的話填充我們的相關(guān)的數(shù)據(jù)
? onShareAppMessage(){
? ? // 在我們的這個(gè)位置的話就是闖進(jìn)我們的相關(guān)的方法
? ? return{
? ? ? title: 'checkbox',
? ? ? path: 'pages/checkbox/checkbox'
? ? }
? },
// 然后的話就是填充我們的相關(guān)的數(shù)據(jù):
data:{
? ?// 然后的話在我們的這個(gè)位置的話就是設(shè)置我們的相關(guān)的方法
? items:[
? ? {value:'usa', name:'影響力'},
? ? { value: 'usa', name: '影響力' },
? ? { value: 'usa', name: '韭菜的自我修養(yǎng)' },
? ? { value: 'usa', name: '你的名字' },
? ? { value: 'usa', name: '怪誕行為學(xué)' ,checked: 'true'},
? ? { value: 'usa', name: '教父' },
? ? { value: 'usa', name: '經(jīng)濟(jì)學(xué)原理' },
? ? { value: 'usa', name: '三國演義' },
? ? { value: 'usa', name: '絕對(duì)成交' },
? ? { value: 'usa', name: '行為經(jīng)濟(jì)學(xué)講義' },
? ? { value: 'usa', name: '黑天鵝' },
? ? { value: 'usa', name: '灰犀牛' },
? ]
},
// 在我們的額這個(gè)位置的話就是設(shè)置我們的相關(guān)的方法

? // 在我們的這個(gè)位置的話就是創(chuàng)建一個(gè)有參數(shù)的構(gòu)造方法
? checkboxChange(e){
? ? // 在我們的這位置的話就是在我們的控制臺(tái)中輸出我們需要的東西
? ? console.log('checkbox發(fā)生change事件,攜帶value值為:', e.detail.value)
? ? const items = this.data.items
? ? const values = e.detail.value
? ? // 然后的話在我們的這個(gè)位置使用我們的for循環(huán)來設(shè)置創(chuàng)建我們的相關(guān)的東西
? ? for (let i = 0, lenI = items.length; i < lenI; ++ i){
? ? ? // 然后的話就是循環(huán)遍歷到后就獲取到我們的東西
? ? ? items[i].checked = false
? ? ? for (let j = 0, lenJ = values.length; j < lenJ; ++j){
? ? ? ? if (items[i].value === values[j]){
? ? ? ? ? items[i].checked = true
? ? ? ? ? break
? ? ? ? }
? ? ? }
? ? }
? ? // 然后的話在我們的下面的這個(gè)位置的話就是設(shè)置我們的相關(guān)的方法
? ? this.setData({
? ? ? items
? ? })?
? ??
? }
})

以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論