问答

vue使用el-checkbox-group复选框组件编辑页面回显后不能再次选择

作者:admin 2021-05-07 我要评论

这是渲染的地方 el-form-item label="选择项目" :label-width="formLabelWidth" prop="report_project_idsArr" el-checkbox-group v-model="form.report_project...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

这是渲染的地方

<el-form-item label="选择项目" :label-width="formLabelWidth" prop="report_project_idsArr">
   <el-checkbox-group v-model="form.report_project_idsArr">
       <el-checkbox v-for="item in projectList" :label="item.project_id" :key="item.project_id">{{item.project_name}}</el-checkbox>
   </el-checkbox-group>
</el-form-item>

这是data里的,report_project_ids是后台返回来的,他的格式是'[1,2]'这样的,report_project_idsArr是我转化成数组的格式[1,2]

form: {
    report_name: "",
    report_pinyin: "",
    report_project_ids:'',
    report_project_idsArr:[]
},

这是转化过程

let a = res.data.report_project_ids.replace('[','')
let b = a.replace(']','')
let stringResult = b.split(',').map(Number);
this.form = res.data
this.form.report_project_idsArr = stringResult

image

回显成功,但是无法再次点击,大佬们这个怎么搞

###

如果是新人,那就给你说详细一点
1.先确定你的vue版本是不是2.X,如果是,那么你的这行代码先确定是不是已经双向绑定到了form之上(多半没有)

`this.form.report_project_idsArr = stringResult`
换成$set的方式

2.后端给你的字符串格式的数组,转换也没那么麻烦

`JSON.parse(res.data.report_project_ids)`

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • vue使用el-checkbox-group复选框组件编

    vue使用el-checkbox-group复选框组件编

  • react-native 友盟统计 onEventWithMap

    react-native 友盟统计 onEventWithMap

  • VUE使用v-for循环不刷新视图的问题,求

    VUE使用v-for循环不刷新视图的问题,求

  • 请问我这个浮动怎么去除不了,谢谢

    请问我这个浮动怎么去除不了,谢谢

腾讯云代理商
海外云服务器