위챗 애플릿 선택 checkbox 선택 후 스타일 변경

1881 단어
원리: checkChange를 통해 모든 checkbox의 변화를 감청하고, 감청 함수는 e.dtail을 통해 감청한다.value는 선택된 그룹을 가져옵니다. 선택된 그룹checkArr[]을 통해 원래의 데이터 그룹items[]의 선택된 대상의check 속성에true를 설정하고, 선택되지 않은false를 설정합니다. wxml에서 각 대상의 checked 속성을 판단하여 "ischecked

wxml

 
       


js

data: {
    showDialog: false,
    showDialogRight:false,
    items: [
      { name: '0', value: ' ', checked: false,},
      { name: '1', value: ' ', checked: false,},
      { name: '2', value: ' ', checked: false,},
      { name: '3', value: ' ', checked: false,},
      { name: '4', value: ' ', checked: false,},
      { name: '5', value: ' ', checked: false,},
      { name: '6', value: ' ', checked: false,},
      { name: '7', value: ' ', checked: false,},],
  },
checkChange: function (e) {
    console.log('radio change , value :', e)
    var that = this
    that.setData({
      value: e.detail.value
    })
    var items = this.data.items;
    var checkArr = e.detail.value;
    for (var i = 0; i < items.length; i++) {
      if (checkArr.indexOf(i + "") != -1) {
        items[i].checked = true;
      } else {
        items[i].checked = false;
      }
    }
    this.setData({
      items: items
    })  
  },

출처:http://blog.csdn.net/Wu_shuxuan/article/details/78491953?locationNum=3&fps=1

좋은 웹페이지 즐겨찾기