Как я могу получить значение, когда нажмите кнопку выбора в VUE? - PullRequest
Новая
       5

Как я могу получить значение, когда нажмите кнопку выбора в VUE?

0 голосов
/ 16 сентября 2018

Мой компонент vue выглядит следующим образом: 

<template>
    ...
        <small class="text-muted">Quality</small><br>
        <b-form-select class="mb-2 mr-sm-2 mb-sm-0"
                       :options="optQuality"
                       v-model="slcQuality" @change="changeQuality">
        </b-form-select>
    ...
</template>
<script>
    export default {
        ...
        data () {
            return {
                optQuality: [
                    { value: 1, text: 'Original' },
                    { value: 2, text: 'Kw-1' },
                    { value: 3, text: 'Kw-2' }
                ],
                slcQuality: 1
            }
        },
        methods: {
            changeQuality() {
                console.log('test')
                console.log(this.slcQuality)
            }
        }
    }
</script>

Если я выберу опцию Kw-1, я получу результат со значением 1

Если я снова выберу опцию Kw-2, яполучить результат со значением 2

неверный результат

Как я могу решить эту проблему?

1 Ответ

0 голосов
/ 16 сентября 2018

В этом случае событие change происходит до обновления slcQuality с помощью v-model (что происходит с событием input).changeQuality записывает значение slcQuality в это время, поэтому может показаться, что slcQuality не обновляется, но на самом деле это происходит в последующем событии.

Вы можете увидеть обновленноепрослушивая значение input вместо change: 

<b-form-select @input="changeQuality">

демо

...