roujennie 2022-11-15 12:09 采纳率: 84%
浏览 4
已结题

微信开发 点击tab上的x,对应改变checkbox的是否勾选状态

用代码块功能插入代码,请勿粘贴截图

图上灰色标签渲染

<view class="tab" wx:for="{{codelist}}" wx:key="status" wx:if="{{item.Checked == true}}">
        <label for="status">
                {{item.statusName}}
                <image catchtap="deleteTab" data-status="{{item.status}}" src="/image/x.png"></image>
        </label>
                    
</view>    

img

checkbox

<checkbox-group id="statusUTypeList" name="statusUTypeList" bindchange="select" data-status="{{item.status}}" class="popup-row">
            <checkbox wx:for="{{codelist}}" wx:key="status" value="{{item.status}}" id="status">
                {{item.statusName}}
            </checkbox>
        </checkbox-group>


img

select(e){
            console.log(e)
            let status = e.detail.value;
            // var result = new Array();
            let result;
            // 新增值
            if(status.length>this.data.oldvalue.length){
                for(var i=0;i<status.length;i++){
                    if(this.data.oldvalue.indexOf(status[i]) == -1)    {
                //   result.push(status[i]);
                    result = status[i]
                    }      
                }
            }else{ //减少
                for(var i=0;i<this.data.oldvalue.length;i++){
                    if(status.indexOf(this.data.oldvalue[i]) == -1)    {
                //   result.push(status[i]);
                    result = this.data.oldvalue[i]
                    }      
                }
            }

            let list = this.data.codelist;
            let index = list.findIndex(v =>v.status == result)
            list[index].Checked = !list[index].Checked;
            this.setData({
                  codelist:list,
                  oldvalue:status
            })
        },

我的解答思路和尝试过的方法

尝试用label标签绑定可是无效,我能做的点击×按钮改变codelist对应status的checked的值,但是checkbox里并没有把对应的选中状态取消

我想要达到的结果

点击tab上的x,对应改变checkbox的是否勾选状态

  • 写回答

1条回答 默认 最新

  • 这个需求做不了123 2022-11-15 14:15
    关注

    单纯看你这个代码,好像没啥问题,

    let list = this.data.codelist;
    let index = list.findIndex(v =>v.status == result)
     list[index].Checked = !list[index].Checked;
    // 你在这个位置打印console.log(list) ,看下你点击后,这个list有没有改变?如果变了,那说明你checkbox那里写得有问题
    // 另外 微信小程序得checkbox 太丑,一般都是自己模拟,定义一组数据,[{label: '发布', checked: false},{label: '审核', checked: false}]
    // 通过checked 得值,来渲染展示选中和未选中得样式,可以用小图标来做,
    this.setData({
        codelist:list,
         oldvalue:status
     })
    
    

    如果有问题,再找我

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

问题事件

  • 系统已结题 11月23日
  • 已采纳回答 11月15日
  • 创建了问题 11月15日

悬赏问题

  • ¥15 有没有整苹果智能分拣线上图像数据
  • ¥20 有没有人会这个东西的
  • ¥15 cfx考虑调整“enforce system memory limit”参数的设置
  • ¥30 航迹分离,航迹增强,误差分析
  • ¥15 Chrome Manifest扩展引用Ajax-hook库拦截请求失败
  • ¥15 用Ros中的Topic通讯方式控制小乌龟的速度,走矩形;编写订阅器代码
  • ¥15 LLM accuracy检测
  • ¥15 pycharm添加远程解释器报错
  • ¥15 如何让子窗口鼠标滚动独立,不要传递消息给主窗口
  • ¥15 如何能达到用ping0.cc检测成这样?如图