Verhindern Sie, dass bestimmte Chips aus der Combobox entfernt werden
P粉674757114
P粉674757114 2024-02-03 16:42:39
0
1
436

Ich habe diese combobox 芯片,但有一个问题 deletable-chips

<v-combobox
    v-model="selectedCategories"
    :items="attributeCategories"
    item-text="name"
    item-value="id"
    label="Category"
    multiple
    chips
    clear-icon="mdi-close-circle"
    deletable-chips
    v-on:change="changeCategory(selectedCategories)"
></v-combobox>

Gibt es eine Möglichkeit, das Löschen bestimmter Chips zu verhindern? Wird beispielsweise bei einer bestimmten Schaltfläche keine Löschschaltfläche angezeigt? Angenommen für Device 且只允许删除 WeatherGeo Location

P粉674757114
P粉674757114

Antworte allen(1)
P粉354948724

而不是使用v-chips内置的删除方法。您可以通过自定义 @click:close 事件来实现。我为您创建了一个工作演示

new Vue({
  el: '#app',
  vuetify: new Vuetify(),
  data: () => ({
    model: [],
    items: [
      {
        text: 'Weather'
      },
      {
        text: 'Geo Location'
      },
      {
        text: 'Device'
      }
    ]
  }),
  methods: {
    remove (itemText) {
      if (itemText === 'Device') {
        return;
      } else {
        this.model.forEach(obj => {
          if (obj.text === itemText) {
            this.model.splice(this.model.indexOf(obj), 1)
          }
        })
        this.model = [...this.model]
      }
    }
  }
})




Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage