uview Checkbox 复选框每一项增加删除功能

在这里插入图片描述
如图,在uview Checkbox 复选框的基础上,需要对每一项增加一个删除功能

<u-form-item
                    style="padding:0 40rpx;"
                    label="子任务"
                    prop="subtask"
                >
                    <view style="display:flex;">
						<view class="">
								<u-checkbox-group
									v-model="subTaskValue"
									placement="column"
									@change="checkboxChange"
								>
								<template v-for="(item, index) in subTaskCheckboxList" class="flex flex-wrap flex-jc-start flex-ai-start">
									//在外层包裹一个template
									<u-checkbox
										:customStyle="{marginBottom: '8px',width:'650rpx'}"
										:key="item.id"
										:label="item.name"
										:name="item.id"
									>
									</u-checkbox>
									<view class="flex-jc-between flex" >
										<span>
											{{ item.time==''?'无':item.time + '截止' }}
										</span>
										<span>
										{{ item.staffName==''?'无':item.staffName }}
										</span>
										<span style="color:red;" @click="delSubTask(item,index)">删除</span>
									</view>
								</template>
								</u-checkbox-group>
								<view class="addSubTask">
									<u-tag text="新建子任务" size="mini" shape="circle" @click="()=>{createSubTaskShow=true;}"></u-tag>
								</view>
						</view>
                    </view>
                </u-form-item>
  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值