小程序 单选 与 多选 示例

单 选1 ：

<view class="{{rubbishindex == index?'err active':'err'}}" wx:for="{{rubbishlist}}" data-type="{{item}}" data-index="{{index}}" wx:key="index" bindtap="addrubbish">{{item}}</view>

data: {
rubbishlist:['厨余垃圾','可回收垃圾','有害垃圾','其他垃圾','其他垃圾','其他垃圾',],
rubbishindex:2,
}

addrubbish:function(e){
var that = this;
var index = e.currentTarget.dataset.index;
that.setData({
rubbishindex:index
})
},

发送参数：
box: that.data.rubbishlist[that.data.rubbishindex] //有害垃圾

 

单选2：

 <radio-group class="radio-group" bindchange="radioChange">

        <label class="radio" wx:for="{{paylist}}"  wx:key="value" >

            <image class="ico" src="{{item.src}}" mode="aspectFit"></image>

            <text>{{item.value}}</text>

            <radio value="{{item.name}}" checked="true"/>

        </label>

  </radio-group>

 

data: {

    paylist:[

      {name: 'wx', value: '微信支付',src:'/images/buy/wx.png',checked: false},

      {name: 'card', value: '米卡支付', src:'/images/buy/card.png',checked: true},

    ],

    choose_item:'',

}

 

  radioChange:function(e){

    console.log('当前选中'+e.detail.value);

    const items = this.data.paylist;

    for (let i = 0, len = items.length; i < len; ++i) {

      items[i].checked = (items[i].name === e.detail.value)

    }

    this.setData({

      paylist: items

    })

  },

 

发送选中的值：

    const items = this.data.paylist;

    for (let i = 0, len = items.length; i < len; ++i) {

       if(items[i].checked == true){

          that.choose_item = items[i].name;   // wx

       }

    }

 

 

多选：

boxnum:0,

riderCommentList: [{

      value: '厨余垃圾',

      selected: false ,

      title: '厨余垃圾'

    },{

      value: '可回收垃圾',

      selected: false ,

      title: '可回收垃圾'

    },{

      value: '有害垃圾',

      selected: false ,

      title: '有害垃圾'

    },{

      value: '其他垃圾',

      selected: false ,

      title: '其他垃圾'

    },{

      value: '厨余垃圾',

      selected: false ,

      title: '厨余垃圾'

    },{

      value: '可回收垃圾',

      selected: false ,

      title: '可回收垃圾'

    }]

 

    

<view class="{{item.selected ? 'err active' : 'err'}}" wx:for="{{riderCommentList}}" wx:for-item="item" wx:key="item.index"  bindtap="checkboxChange" data-value="{{item.value}}" data-index="{{index}}" >{{item.title}}</view>

 

  checkboxChange(e){

    var that = this;

    console.log('checkboxChange e:',e);

    let string = "riderCommentList["+e.target.dataset.index+"].selected"

        this.setData({

            [string]: !this.data.riderCommentList[e.target.dataset.index].selected

        })

        let detailValue = this.data.riderCommentList.filter(it => it.selected).map(it => it.value)

        console.log('所有选中的值为：', detailValue)

        console.log('个数为', detailValue.length)

        that.setData({

          boxnum:detailValue.length

        })

  },

 

//例如，在一个Array中，删掉偶数，只保留奇数，可以这么写：

var arr = [1, 2, 4, 5, 6, 9, 10, 15];
var r = arr.filter(function (x) {
    return x % 2 !== 0;
 });
r; // [1, 5, 9, 15]


//把一个Array中的空字符串删掉，可以这么写：

 var arr = ['A', '', 'B', null, undefined, 'C', '  '];
 var r = arr.filter(function (s) {
     return s && s.trim(); // 注意：IE9以下的版本没有trim()方法
 });
 r; // ['A', 'B', 'C']