Vuetify update select input-value по событию prepend-item

Я хочу обновить значение выбора, щелкнув добавленный элемент в выборе Vuetify. Но модель не обновляет текст элемента во вводе выбора.

<v-select
 :items = "loadedTasks"
 v-model = "selectedTask"
 item-text = "text"
 item-value = "value"
 return-object
 :menu-props = "{closeOnContentClick: true}"
>
 <template v-slot:prepend-item>
   <v-list-item
    @click = "selectedTask = {text:'none', value: 'none'}"
   >
    Text
   </v-list-item>
 </template>

vue.js vue-component vuetify.js

07.04.2021 09:23

Стоит ли изучать PHP в 2026-2027 годах?

Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Приемы CSS-макетирования - floats и Flexbox

Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...

Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest

В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Пользовательский скаляр GraphQL

Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...

Ответы 1

Если вы пытаетесь добавить какой-то элемент «по умолчанию» к выбору, prepend-slot никуда не денется, поскольку его нельзя «выбрать». Лучше просто добавить свой "дефолтный" элемент прямо в массив loadedTasks

Например, используя вычисленное:

computed: {
  tasksToSelect() {
    return [{text:'none', value: 'none'}, ...this.loadedTasks]
  }
}

... и использовать его как <v-select :items = "tasksToSelect" />

Я просто удалил добавленный элемент ... не было возможности установить первый параметр для отображения: none ... изменил первый элемент в loadedTasks, чтобы он отображался как добавленный элемент ... спасибо!

— 07.04.2021 11:33

07.04.2021 10:26