el-checkbox复选框回显的坑、传参数据格式

VIP文章雷雷叫她菜青蟲

已于 2022-09-02 10:02:12 修改

阅读量2.3k

点赞数

文章标签： vue.js javascript elementui

于 2022-09-01 18:07:41 首次发布

本文链接：https://blog.csdn.net/weixin_43367044/article/details/126648683

版权

当新建/修改共用同一个表单弹窗页面时，复选框绑定赋值要注意

复选框绑定值是数组，数组每一项是label绑定的，即persons对象数组里employeeNo键对应的值：

<el-form ref="form" :model="form">
  <el-form-item label="参与董事" :prop="uassNo" 
   :rules="[{required: true, type: 'array', trigger: 'change', message: '请选择参与董事'}]">
     <el-checkbox-group v-model="form.uassNo">
       <el-checkbox v-for="(item, index) in persons" :label="item.employeeNo" 
       :key="index">{
  {item.memberName}}</el-checkbox>
     </el-checkbox-group>   
  </el-form-item>
</el-form>

export default {
  data() {
    return {
      form: {
        uassNo: [] //data里定义，避免新建报错
      },
      persons: []
    }
  },
  created() {
    this.getPersons();
  }
  methods: {
    getPersons() {
      调接口获取到所有董事