vue el-checkbox多选框标签的使用1-展现多选框列表
来源:月中眠_d56d     阅读:2162
云上智慧
发布于 2019-08-22 01:42
查看主页

问题形容

问题一: 实现查询一律选项(进行增加设置时,需要从新增,所以需要查询所有选项,参数是传递选中的值),实现效果如下图所示

image

实现方法:

1) 在 el-checkbox-group 标签中 写一个 el-checkbox标签 外层写一个li标签(这里其余标签也可以)写法如下图所示

image
<el-checkbox-group  v-model="addRoles">            <li v-for="(item,index) in quanxian" :key="index">              <el-checkbox  :label="item.resourcesID" :key="item.resourcesID" >{{item.name}}</el-checkbox><br>            </li></el-checkbox-group>

2) 下图这么写是解决所有选中框数组里的值,这里存储的是选中框的id值,后端参数需要传递 id 并用逗号分隔,所以这么解决:

//循环数组      for ( var i = 0; i <this.addRoles.length; i++){              console.log(this.addRoles[i]);              if(i===0){                this.addRoleParam.resourcesIDs=this.addRoles[i]              }else {                this.addRoleParam.resourcesIDs+=','+this.addRoles[i]              }       }

3) 下图所示,点击确定调用接口,红框中的id参数,是后端接口要求的格式,假如有其余的解决方法,欢迎交流~

image
免责声明:本文为用户发表,不代表网站立场,仅供参考,不构成引导等用途。 系统环境 服务器应用
相关推荐
广州html5培训机构多少钱?
JS-类型转换
iOS实现OTA无线安装App
人类会被取代么?——观《人工进化》有感~
今日头条适配方案解析
首页
搜索
订单
购物车
我的