关于uniapp checkbox多选框，选中传多个值

最新推荐文章于 2025-05-15 21:34:40 发布

原创最新推荐文章于 2025-05-15 21:34:40 发布 · 552 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#uni-app #前端 #vue.js

本文介绍了如何在JavaScript中使用`JSON.stringify()`方法将包含对象（如patientId和openId）的数据转换为字符串，以便于传输或存储，强调了从传统思维转向适应用场景的转化过程。

看到这篇文章的宝子，转化一下思路

<checkbox class="checked" :value="value" />

value不是只能传单个数据嘛，直接使用JSON.stringify()就好了

<checkbox class="checked" :value="JSON.stringify({patientId:item.patientId,openId:item.openId})" />

搞定，下班

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

吾先生（用户昵称已存在）

关注关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

uni-app——下拉框多选

Tianxiaoxixi的博客

08-04

1万+

uni-app——下拉框多选

uniapp实现表格的多选功能

WaaTong的博客

07-25

1364

记录一下最近在做一个的表格数据多选功能。需求大致为支持多选、支持跨分页的连续选择、支持通过查询框后手动选择数据（

参与评论您还未登录，请先登录后发表或查看评论

关于uniapp checkbox多选框如何传值传数据

weixin_45474844的博客

04-01

6284

uniapp checkbox不支持动态绑定，所以手动传值，设一个数组arr,对复选框进行遍历，如果选中，则将items[i].value放进arr就行了 <checkbox-group @change="checkboxChange"> <label v-for="item in items" :key="item.value"> ...

uView——uview 中 u-checkbox 调节大小

qq_43201350的博客

03-05

1139

uView——uview 中 u-checkbox 调节大小

checkbox传多个值问题

laiahu的专栏

04-09

5849

checkbox传多个值问题:test.jsp页面: function chkChxTest(){ //检查是否选中 var c = document.getElementsByName("chkbox"); var v_flag = false; for(var i=0;i if(c[i].checked) {

uniapp 多选

m0_64622807的博客

03-25

2135

<view class="contentq"> <view @click="isxian = true">按钮</view> <view v-for="item in addList">{{item.title}}</view> <view class="content" v-show="isxian" id="content" @click="confirm"> <scroll-view scro.

精选资源

CheckBox多选取值及判断CheckBox选中是否为空的实例

01-19

实例如下： var chk_value = [];//定义一个数组 //name是CheckBox的name属性定义的名称 ...以上这篇CheckBox多选取值及判断CheckBox选中是否为空的实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希

精选资源

uniapp多选标签/多选按钮/多选框源码

12-01

多选框是常见的UI元素，用户可以选择一个或多个选项。在`uni-app`中，可以使用`<uni-checklist>`组件实现。`<uni-checklist>`内部包含一组`<uni-check-item>`，用户可以选择任意项。通过`options`属性传入数据，`v-...

uniapp-checkbox-group,checkbox复选框多选，单选拿到一个value数组值

itwangyang520的博客

03-23

3339

'checkbox 复选框'

关于checkbox选择个数限制

03-17

在IT行业中，尤其是在前端开发领域，经常需要处理用户交互，比如限制用户在多选框（Checkbox）中选择的项目数量。这个场景广泛存在于各种表单和数据筛选功能中。本篇我们将深入探讨如何实现“关于checkbox选择个数...

鸿蒙OS&UniApp制作多选框与单选框组件#三方框架 #Uniapp

最新发布

小淼淼的博客

05-15

947

你可能会问，UniApp不是已经提供了<checkbox>和<radio>组件吗？为什么还要自定义呢？样式限制：原生组件的样式修改有限，难以满足设计师的"奇思妙想"跨端一致性：原生组件在不同平台的表现可能不一致交互体验：自定义组件可以加入更丰富的交互效果功能扩展：可以根据业务需求添加更多功能通过自定义多选框和单选框组件，我们不仅解决了原生组件样式定制的限制，还提升了组件的可复用性和扩展性。这种组件封装的思路，其实可以应用到各种UI组件的开发中。组件通信：使用v-model结合。

uniapp列表多选

磨磨叽叽季

11-26

7729

选中并获取值，实现的代码如下： <template> <view class="index"> <view class="new_box" style="margin-top: 20upx;"> <view class="bbox"> <view class="list-box" v-for="(item,index) in list" :key="index"> <view class="list-ed"&g.

uniapp循环多选

peijiajing的博客

04-26

591

代码运行看效果 <template> <view class="content"> <view :class="item.checked ? 'a' : ''" @tap='dianji(index)' v-for="(item,index) in arr2" style="width:100upx;height: 50uxp;border: 1px solid red;margin-top: 20upx;"> {{item.name}} </v

uniapp---多选框功能

m0_71130954的博客

09-07

2654

【代码】uniapp---多选框功能。

uniapp多选标签/多选按钮/多选框

weixin_40228600的博客

12-01

7984

实现简单的多选标签按钮

关于uniapp checkbox复选框问题最多限制两个以及多个的选项

weixin_45474844的博客

04-01

5572

以下是根据uniapp官网给的代码改写的，理解后发现@change是每点击一次就触发一次checkboxChange函数，想了很久，用一个count来计数，每点击一次，会循环遍历整个选项，凡是有点击的，则会状态变为true，从而count也会自增一，从而最终提交check，看count的值就行。 <checkbox-group @change="checkboxChange"> ...

uni-app:分页实现多选功能

weixin_46001736的博客

08-04

3902

uni-app:分页实现多选功能

uni-app的多选整理（传参数）

meng16的博客

05-18

2049

checkbox 在这里传了三个参数，第一个是e,第二个是展示的数组，第三个是需要双向绑定的字段 <view>问题归类_作业质量:</view> <checkbox-group @change="change($event,'zyzl','wtglzl')"> <label class="uni-list-cell uni-list-cell-pd" v-for="item in zyzl" :key="item.value"> <view>

uni-app 实现循环多规格（多选功能）

Xinacridine的博客

04-20

955

【代码】uni-app 实现循环多规格（多选功能）

uniapp怎么设<checkbox多选框背景颜色案例

05-30

以下是一个简单的案例，演示如何在uniapp中设置checkbox多选框的背景颜色： ```html <template> <view class="container"> <checkbox v-model="isChecked">选项</checkbox> </view> </template> <style> .container { display: flex; justify-content: center; align-items: center; height: 100vh; } /* 选中状态下的背景颜色 */ input[type="checkbox"]:checked { background-color: #00ff00; } /* 未选中状态下的背景颜色 */ input[type="checkbox"] { background-color: #ffffff; } </style> <script> export default { data() { return { isChecked: false } } } </script> ``` 在上述代码中，我们使用了uniapp的checkbox组件，并且通过v-model绑定了它的选中状态。在style标签中，我们使用了上述提到的CSS样式来设置checkbox多选框的背景颜色。你可以根据自己的需求进行修改，达到你想要的效果。