ANT框架下的级联写法以及添加子集-526互联

首先了解级联的创建表，比如一个商品类型表

1.创建个商品类型表，属性如下

 /// <summary>
    /// 商品类型表
    /// </summary>
    [Table("GoodsType")]
    public class GoodsType: Audit
    {
        /// <summary>
        /// 商品类型id
        /// </summary>
        [Key]
        [SugarColumn(IsPrimaryKey = true, IsIdentity = true)]  //id自增
        public int GoodsTypeId { get; set; }
        /// <summary>
        /// 商品类型名称
        /// </summary>
        [SugarColumn(IsNullable = false)]//属性不能为空 true为空
        public string? GoodsTypeName { get; set; }
        /// <summary>
        ///父级Id
        /// </summary>
        [SugarColumn(IsNullable = false)]//属性不能为空 true为空
        public int ParentId { get; set; }
    }

　　随后创建一个后台与前天进行传值的中间表（此表不需要迁移）

 public class MenuItem
    {
        public int Value { get; set; }
        public string? Label { get; set; }
        public List<MenuItem>? Children { get; set; }


    }

　　创建完成后，给商品类型表添加数据如下（注意ParentId的值的子集一定要与父级goodsTypeId一致）

随后进行后台编写

 public  async Task<List<MenuItem>> GetMenuItems(int gid)
        {
           
           var list = await sqlSugar.Queryable<GoodsType>().Where(x=>x.ParentId==gid).Select(x =>  new MenuItem
            {
                Value = x.GoodsTypeId,
                Label = x.GoodsTypeName,
            }).ToListAsync();
              foreach ( var item in list)
            {
                item.Children = await GetMenuItems(item.Value);
            }
            return list;

        }

　　后台进行写完进行前台编写

　　显示区域这样写

<a-form-model-item label="父级id" prop="goodsType">
        <a-cascader
          v-model="form.pIdArr"
          :options="options"
          placeholder="Please select"
          @change="handleChange"
          :props="{ checkStrictly: true }"
        />

　　data中这样写

  form: {
        pId: 0,
        goodsTypeName: "",
        pIdArr: [],
        parentId: "",
        haschildern: false,
      },
      options: [],

　　方法如下

 loadShowTree() {
      this.axios
        .get("http://localhost:5214/api/Goods/GetMenuItems")
        .then((res) => {
          this.options = res.data;
          console.log(this.options);
        });
    },
    handleChange(value) {
      alert(value);
      this.form.pId = this.data.value;
      this.form.goodsTypeName = this.data.label;
      this.form.haschildern = this.data.children && this.data.children > 0;
    },

　　到此编写完毕