情况1、v-show 在小程序环境,v-show无效,要隐藏的项仍然显示,H5可实现隐藏
<checkbox-group @change="onCheck">
<label v-show="item.show" v-for="item in checkboxItems" :key="item.value">
<checkbox :value="item.value" :checked="item.checked" />{{item.label}}
</label>
</checkbox-group>
情况2、v-if 在小程序环境有效,但onCheck事件打印结果e.target.value数组内没有被隐藏的这一项的value值,是因为元素没有被渲染,所以:checked无效吗?可以这么理解吗?
<checkbox-group @change="onCheck">
<label v-show="item.show" v-for="item in checkboxItems" :key="item.value">
<checkbox :value="item.value" :checked="item.checked" />{{item.label}}
</label>
</checkbox-group>
情况3、解决办法 动态style,可实现既不显示要隐藏的项,onCheck事件又可以打印出隐藏项的value值
<checkbox-group @change="onCheck">
<label :style="{display:item.show ? '' : 'none'}" v-for="item in checkboxItems" :key="item.value">
<checkbox :value="item.value" :checked="item.checked" />{{item.label}}
</label>
</checkbox-group>
0 个回复