美文网首页
uni-app 开发APP动态设置check-box的选中

uni-app 开发APP动态设置check-box的选中

作者: 朝云幕雪 | 来源:发表于2020-08-12 10:59 被阅读0次

    在我们使用uni-app框架开发的时候可能会有这么一场景就是通过业务代码动态来设置check-box的选中,可以按以下方式做。

    1. 首先编码实现checkBox选择变量和UI布局标签
      ...
      <checkbox-group @change="checkBoxmA">
      <checkbox value ='0' :checked="allCk" style="position: absolute; top: 0upx;left: 10upx;">
      </checkbox>
      </checkbox-group>
      <button @tab='tapCheck()'> 取消选中</button>
      ..
      2.实现js业务逻辑代码
      A:设置checkBox初始化为未选中
      data(){
      return {allCk:false}
      }
      B.实现监听checkBoX值变化方法
      checkBoxmA(e){
      if(e.detail.value=='0'){
      this.allCk = true
      }else{
      this.allCk = false
      }
      }
      注意:当value=='0'时为选中,需要设置选中变量allCk的值。不然后面动态设置allCk时候checkBox的选中状态不会变。
      C.实现代码设置CheckBox为未选中
      tapCheck(){
      this.allCk = false //设置false是未选中,设置true为选中
      }

    相关文章

      网友评论

          本文标题:uni-app 开发APP动态设置check-box的选中

          本文链接:https://www.haomeiwen.com/subject/jkspdktx.html