1.后台请求初始化复选框

常用属性
type：input的话是输入框，select是下拉选择框,checkbox是复选框
label：属性名对应的名称，也是前端列表所显示的列名
prop：属性名
dicUrl：对应请求后台路径
dicMethod:请求方法类型
props：形成下拉框的数据，显示的名称是label，选中的值是value，可以分别映射后端返回的值
rules：一些验证规则

2.运行结果

3.后台请求初始化下拉列表

4.运行结果

5.默认初始化下拉列表，初始化复选框

直接调用beforeOpen方法，通过this.$set(this.form);来初始化表单

<div class="app-container">
    <avue-crud
      ref="crud"
      :page="page"
      :data="tableData"
      :permission="permissionList"
      :table-loading="tableLoading"
      :option="tableOption"
      :before-open="beforeOpen"
      v-model="form"
      @on-load="getPage"
      @refresh-change="refreshChange"
      @row-update="handleUpdate"
      @row-save="handleSave"
      @row-del="handleDel"
      @sort-change="sortChange"
      @search-change="searchChange"
      @selection-change="selectionChange"
    >
    </avue-crud>
  </div>

data() {
    return {
      checkPermi: checkPermi,
      form: {},
      tableData: [],
      page: {
        total: 0, // 总页数
        currentPage: 1, // 当前页数
        pageSize: 20, // 每页显示多少条
        ascs: [], //升序字段
        descs: "create_time", //降序字段
      },
      paramsSearch: {},
      tableLoading: false,
      tableOption: tableOption,
      dialogAppraises: false,
      optionAppraises: {
        props: {
          avatar: "nickName",
          author: "headimgUrl",
          body: "content",
        },
      },
      selectionData: "",
      pointsConfig: null,
    };
  },

beforeOpen(done, type) {
      if (type == "add") {
        done();
      } else if (type == "edit") {
        this.tableLoading = true;
        //根据id查询
        getObj(this.form.id).then((response) => {
          //初始化复选框
          this.form.ensureIds=response.data.ensureIds;
          //初始化下拉列表
          this.form.shipId=response.data.shipId;
          //也可以不发送后端请求，直接赋值表单即可，this.form是page列表的数据
          this.$set(this.form);
          this.tableLoading = false;
          done();
        });
      }
    },

关于this.$set详细介绍