antd-vue中下拉多选组件中的全选和清空

*1:对antd -vue 中下拉多选中全选，清空操作及代码
*
html部分：

 <a-form-item label="适用楼宇" :labelCol="labelCol" :wrapperCol="wrapperCol">
            <a-select
              v-decorator="['buildingsList', { rules: [{ required: true, message: '请选择适用楼宇!' }] }]"
              @change="handleChange2"
              mode="multiple"
            >
//全选，清空
              <div slot="dropdownRender" slot-scope="menu">
                <v-nodes :vnodes="menu" />
                <a-divider style="margin: 4px 0" />
                <div style="padding: 4px 8px; cursor: pointer" @mousedown="(e) => e.preventDefault()">
                  <a-button type="link" @click="selectAll">全选</a-button>
                  <a-button type="link" @click="clearAll">清空</a-button>
                </div>
              </div>
//
              <a-select-option v-for="(item, index) in LYlist" :key="index" :value="item.buildingId">
                {{ item.buildingName }}
              </a-select-option>
            </a-select>

js部分：

 // 楼宇全选和清空
 this.LYlist就是数据源
 buildingId是后需要的数据
 this.buildingsType是后端和我要求的，全选是1，清空是0.
    selectAll() {
      this.buildingsType = 1
      const arr = []
      this.LYlist.forEach((item) => {
        arr.push(item.buildingId)
      })
      this.form.setFieldsValue({
        buildingsList: arr,
      })
    },
    clearAll() {
      this.buildingsType = 0
      this.form.setFieldsValue({
        buildingsList: [],
      })
    },
     handleChange2(val) {
    //刷新一下组件的方法，要是你门碰见明明修改了组件的值，
    //但是显示没有变化，试试组件强制刷新这个方法
      this.$forceUpdate()
    },

注： 使用的 v-decorator 并不是v-modal。
上图：