小程序多选框checkbox-group: 同时获取id跟name

小程序多选框,同时获取ID 跟 NAME,因为把下拉多选框封装成自定义组件,所有就要同时获取到选中的ID 跟 NAME

官方中是这样的,如下图所示

小程序多选框checkbox-group: 同时获取id跟name_第1张图片
上面官方中例子只带一个参数,我要同时获取两个参数,那么怎么才能带两个参数呢?可以像下面这样写
小程序多选框checkbox-group: 同时获取id跟name_第2张图片
小程序多选框checkbox-group: 同时获取id跟name_第3张图片
这样就可以同时获取到选中的ID跟NAME了

下面贴出代码

wxml文件


  
    
    {{item.name}}
  


js文件

Page({

  /**
   * 页面的初始数据
   */
  data: {
    list: [{
        id: "0001",
        name: "张三"
      },
      {
        id: "0002",
        name: "李四"
      },
      {
        id: "0003",
        name: "王五"
      }
    ]
  },

  /**
   * 多选框值改变事件
   */
  checkboxChange: function(e) {
    var item = e.detail.value //选中的数组
    var id = []; //选中的ID
    var name = []; //选中的NAME

    //循环选中的数组,取出对应的数据进行数组拼接
    for (var i = 0; i < item.length; i++) {
      var row = item[i].split(",") //将数组进行分割
      id = id.concat(row[0]) //数组下表的第一个为id
      name = name.concat(row[1]) //数组下表的第二个为name
    }
    console.log(id)
    console.log(name)
  }
})
  

wxss文件

.item {
  line-height: 100rpx;
  background-color: #eee;
  border: 2rpx solid #fff;
}

好了,有什么不懂的地方或者可以改进的欢迎指出。

你可能感兴趣的:(小程序)