vue中实现checkbox回显效果
更新时间：2023年12月05日 17:06:19 作者：anshengsuiyeu
这篇文章主要介绍了vue中实现checkbox回显效果,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
vue实现checkbox回显效果
当我选中多选框，点击确定后，再打开弹框，如何让之前选中的值回显到页面上。
给遍历的元素 双向绑定
v-model="businessregion.checked"
<template v-if="businessregionList.length > 0">
<template v-for="businessregion in businessregionList">
<dd>
<input type="checkbox" name="businessregion" class="businessregion" :data-id="businessregion.businessregionCode" v-model="businessregion.checked"/>
<label for="city4">{{businessregion.businessregionName}}</label>
</dd>
</template>
</template>就很容易实现多选框回显了
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
<script setup>是在单文件组件中使用Composition API的编译时语法糖,下面这篇文章主要给大家介绍了关于vue3:setup语法糖使用的相关资料,需要的朋友可以参考下2022-08-08
element-ui el-select下拉框el-date-picker弹出框定位问题解决方案(推荐)
项目开发过程中发现el-select和el-date-picker弹出框显示时候,滚动屏幕,导致弹出框定位出现问题,这篇文章主要介绍了element-ui el-select下拉框el-date-picker弹出框定位问题解决方案(推荐),需要的朋友可以参考下2024-07-07
vue.js，是一个构建数据驱动的 web 界面的库。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。下面这篇文章主要给大家介绍了关于vue项目中v-model父子组件通信实现的相关资料，需要的朋友可以参考下。2017-12-12
这篇文章主要介绍了Vue-cli3简单使用(图文步骤)，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2019-04-04
这篇文章主要介绍了Elementui如何限制el-input框输入小数点，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-08-08
这篇文章主要介绍了uni-app 的模板语法，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2021-10-10
这篇文章主要介绍了vue数据更新UI不刷新显示的解决办法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-08-08
这篇文章主要为大家详细介绍了vue中两种路由模式的实现，文中的示例代码讲解详细，具有一定的学习价值，感兴趣的小伙伴可以了解一下2023-08-08
在现代 Web 开发中,字体文件通常是页面加载时间的重要因素之一,特别是在字体文件较大或网络环境不佳的情况下,用户体验可能会受到影响,本文将详细探讨如何在 Vue.js 项目中优化字体文件的加载和缓存,以提高页面性能,需要的朋友可以参考下2024-09-09
本文主要介绍了vue项目使用modbus实现串口通讯的示例代码,可以实现与Modbus设备的数据交互,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧2025-02-02
最新评论