naive-ui编程中，有一个多选的n-select, 怎么在选中all的时候， 别的选项去掉？ 给出代码例子!

在Naive UI 中，`<n-select>` 是一个组件用于创建下拉多选列表。如果你想实现在全选所有选项时清除其他单个选项，你可以通过监听 `selection-change` 事件，并根据当前的选择状态动态控制其他选项的不可选择。这里是一个简单的 Vue.js 示例：

<template>
  <div>
    <n-select v-model="selectedItems" :options="options" @selection-change="handleSelectionChange">
      <!-- 这里是你的选项列表 -->
    </n-select>
    <button @click="selectAll">全选</button>
    <button @click="clearAll">全清</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      selectedItems: [], // 当前选中的项
      options: ['Option 1', 'Option 2', 'Option 3'], // 下拉框的选项
    };
  },
  methods: {
    handleSelectionChange(items) {
      if (items.length === this.options.length) { // 全选状态
        this.selectedItems = items;
        this.clearOtherOptions();
      } else {
        this.selectedItems = items; // 正常选择状态
      }
    },
    clearOtherOptions() {
      for (let i = 0; i < this.options.length; i++) {
        if (this.selectedItems.includes(this.options[i])) {
          continue;
        }
        // 设置其他选项不可选
        this.$set(this.options, i, { disabled: true });
      }
    },
    selectAll() {
      this.selectedItems = this.options.map(item => item);
    },
    clearAll() {
      this.selectedItems = [];
      this.options.forEach(option => {
        option.disabled = false; // 取消所有选项的禁用状态
      });
    },
  },
};
</script>

在这个例子中，当用户点击全选按钮时，`selectAll` 方法会将所有选项设置为已选。同时，`handleSelectionChange` 函数会在选中状态改变时检查是否全选，如果是，则调用 `clearOtherOptions` 来禁用除已选之外的所有选项。相反，如果从全选恢复到部分选择，其他选项会恢复正常。