Die durch das Auswahl-Dropdown-Feld in der Ant-Design-Vue-Tabelle ausgewählten Elemente sind deaktiviert (können nicht wiederholt werden).

Daten abrufen. Jedes Mal, wenn das Dropdown-Feld den Fokus erhält, fügen Sie über eine Schleife das deaktivierte Attribut zu jedem Element der erfassten Daten hinzu und setzen Sie es auf „false“, um festzustellen, ob die erfassten Daten die von Ihnen ausgewählten Daten enthalten. Wenn dies der Fall ist, fügen Sie das Element hinzu Die erfassten Daten. „Daten deaktiviert“ wird auf „True“ gesetzt.

      <a-table
        :columns="columns"
        :data-source="syList"
        :pagination="false"
      >
        <template slot="syCode" slot-scope="text, record, index">
          <a-select
            style="width: 140px"
            v-model="syList[index].syCode"
            placeholder="请选择"
            @focus="handleFocus"
          >
            <a-select-option
              :value="item.dataCode"
              v-for="(item, i) in data"
              :key="i"
              :disabled="item.disabled"
            >
              {
   
   { item.dataLable }}
            </a-select-option>
          </a-select>
         </template>
       </a-table>
	data(){
    
    
		syList:[],//自己选过的数据
		data:[],//获取的数据(下拉框中的数据)
		columns:[
			{
    
    
          		title: "syCode",
          		align: "center",
          		key: 'syCode',
          		scopedSlots: {
    
     customRender: "syCode" },
        	},		
		]
	}
//获取数据
  created () {
    
    
    getData().then(res => {
    
    
      this.data = res.data
    })
  },
  methods:{
    
    
    handleFocus () {
    
    
      if (this.data) {
    
    
        this.data.forEach((item) => {
    
    
          item.disabled = false//每次下拉都需要重置禁用属性
        })
      }
      if (this.syList) {
    
    
        this.data.forEach((item) => {
    
    
          this.syList.forEach((myitem) => {
    
    
            if (item.dataCode === myitem.syCode) {
    
    
              item.disabled = true
            }
          })
        })
        this.$forceUpdate(); //一定要刷新组件!!!!!!!!!!!!
      }
    },
  }

おすすめ

転載: blog.csdn.net/q249859693/article/details/126597960