效果图下：

代码如下：

html:

<template>

       <a-form-item field="GIDLST" label="组列表"  >

           <a-checkbox-group class="custom-checkbox-group" direction="horizontal" v-model="formData.GIDLST" style="margin-left: 10px">

                  <a-checkbox v-for="item in gidlstlist" :key="item.AID" :label="item.NM" :value="item.AID" >

                         {{ item.NM }}

                   </a-checkbox>

             </a-checkbox-group>

         </a-form-item>

</template>

ts:

 const basedata={

            GIDLST:[],

     }

const gidlstdata = await Get_gidlst_selectlist();

          if (gidlstdata) {

            gidlstlist.value = gidlstdata

          } else {

            gidlstlist.value = []

          }

          isUpdate.value = !!data?.isUpdate;

          if (unref(isUpdate)) {

            formData.value=cloneDeep(data.record);

            //对后端数据进行加工，得到我们想要得这种结构得数据[1,2,3,4]

            formData.value.GIDLST = formData.value.GIDLST.split(',').map(item => Number(item));

          }else{

            formData.value=basedata

          }