songxin1980
songxin1980
  • 发布:2020-10-27 08:01
  • 更新:2020-10-27 17:35
  • 阅读:764

使用checkbox-group,

分类:uni-app

使用checkbox-group,想达到点本行的任何位置均选中checkbox的效果,怎么做?代码和目前的显示效果如图。

            <checkbox-group @change="checkChange2">  
                <view class="tui-cart-cell  tui-mtop" v-for="(item, index) in dataList2" :key="item.ID">  
                    <view class="tui-goods-item">  
                        <label class="tui-checkbox"><checkbox :value="item.ID+''" :checked="item.check" color="#10bd6e"></checkbox></label>  
                        <image :src="item.Pic" mode="aspectFill" class="tui-goods-img" />  
                        <view class="tui-goods-info">  
                            <view class="tui-goods-title">{{ item.Title }}-{{ item.u8code }}</view>  
                            <view class="tui-price-box">  
                                <view class="tui-goods-price">{{ item.Status }}</view>  
                            </view>  
                        </view>  
                        <view class="tui-goods-num">{{ item.Num }}</view>  
                    </view>  
                </view>  
            </checkbox-group>
2020-10-27 08:01 负责人:无 分享
已邀请:
uniapp追随者

uniapp追随者

想点哪里选中复选框,就用 label 标签包含它,如:

<checkbox-group @change="checkChange2">    
    <label>  
                <view class="tui-cart-cell  tui-mtop" v-for="(item, index) in dataList2" :key="item.ID">    
                    <view class="tui-goods-item">    
                        <checkbox :value="item.ID+''" :checked="item.check" color="#10bd6e"></checkbox>   
                        <image :src="item.Pic" mode="aspectFill" class="tui-goods-img" />    
                        <view class="tui-goods-info">    
                            <view class="tui-goods-title">{{ item.Title }}-{{ item.u8code }}</view>    
                            <view class="tui-price-box">    
                                <view class="tui-goods-price">{{ item.Status }}</view>    
                            </view>    
                        </view>    
                        <view class="tui-goods-num">{{ item.Num }}</view>    
                    </view>    
                </view>    
    </label>  
</checkbox-group>

请根据具体情况调整代码位置和样式

该问题目前已经被锁定, 无法添加新回复