Отображение выбранной опции v-menue в другой части приложения.Vuetify - PullRequest
Новая
       8

Отображение выбранной опции v-menue в другой части приложения.Vuetify

0 голосов
/ 13 декабря 2018

Итак, у меня есть v-меню с некоторыми опциями.Теперь я хочу отобразить выбранную опцию в другой части моего приложения (тот же компонент).Я пытался сделать это с помощью V-модели, но это не работает.Какой лучший способ сделать это?

Это код v-меню, и я хочу отобразить выбранную опцию: 

<v-menu bottom transition="scale-transition" >
  <v-btn slot="activator">​ 
      28
  </v-btn>
  <v-list>
    <v-list-tile
      v-for="(item, index) in PIFBitems"
      :key="index"
      v-model="hasan"
      @click="boardSwitch('shoPFIB', index)"
      >
       <v-list-tile-title>{{ item.title }}</v-list-tile-title>
    </v-list-tile>
  </v-list>
</v-menu>
.
.
.
  <p class="chipPam13"
  >{{this.hasan}}</p>
.
.

Это код скрипта: 

data() {
  return {
    hasan:'',
    PIFBitems:[
    {title: empty},
    {title: PIFB}
    ]
  }
}

1 Ответ

0 голосов
/ 13 декабря 2018

Пожалуйста, используйте hasan вместо this.hasan в своем HTML: 

<p class="chipPam13">{{hasan}}</p>

Или, если v-model не работает, вы можете попробовать установить hasan значение на boardSwitch функцию: 

...
methods: {
    boardSwitch (firstArg, secondArg, value) {
        ...
        this.hasan = value
    },
    ...
}

Пожалуйста, не забудьте добавить третий аргумент к вызову вашей функции в HTML: 

<v-list-tile
  v-for="(item, index) in PIFBitems"
  :key="index"
  v-model="hasan"
  @click="boardSwitch('shoPFIB', index, item.title)"
  >
   <v-list-tile-title>{{ item.title }}</v-list-tile-title>
</v-list-tile>
...