Casilla de verificación WeChat applet

Después de usar el applet WeChat durante dos días, descubrí que TMD es realmente conveniente, JS es realmente mucho menos, y el diseño receptivo realmente ahorra muchas cosas a los desarrolladores.

Aquí está el código html

        <view class="weui-cells weui-cells_form">
          <view class="weui-cell weui-cell_active {{isWaring ? 'weui-cell_warn' : ''}}">
            <view class="weui-cell__hd">
              <label class="weui-label">跟单</label>
            </view>
            <view class="tui-content">
              <checkbox-group bindchange="checkboxChange2">
                <label class="checkbox" wx:for="{{gendanItems}}">
                  <view class="tui-menu-list">
                    <checkbox value="{{item.empNo}}" checked='{{filter.isChecked2(item.empNo,selectData2)}}' />{{item.name}}</view>
                </label>
              </checkbox-group>
            </view>
          </view>
        </view>

Aquí escribí esto en el código html, principalmente se hizo eco en el archivo js y tengo que asignar uno a uno el atributo verificado del objeto.

  <wxs module="filter">
    var isChecked2 = function(empNo, data) {
      if (empNo != null) {
        return data.indexOf(empNo) != -1 ? true : false;
      }
      return false;
    }

    module.exports = {
       isChecked2: isChecked2,
    }
  </wxs>

gendanItems es un objeto de colección. Lo escribí en Java en el back-end y se pasa una List <bean> desde el back-end. Aquí puedes entenderlo.

selectData2 es la matriz seleccionada capturada en mi js.

Pegar el código

 

  showClearBtn: false,
    selectData2: []  //记住要给个初始值，不然会报错，就这样[]也都可以。
  },


  checkboxChange2: function(e) {
    var up = "pho.gendans2"; //pho是个对象后面的gendans2就是selectData2 可以直接拿给它
    this.setData({
      [up]: e.detail.value
    });
  },

Eso es todo