начальная загрузкакомпонент не изменяется при изменении вычисляемых свойств - PullRequest
0 голосов
/ 27 сентября 2019

Я использую компоненты формы bootstrap-vue в моем проекте.Я получаю данные из vuex в свой компонент с вычисленными свойствами, а затем у меня есть метод, который сохраняет новые данные в хранилище vuex.Когда данные в хранилище обновляются, данные в вычисляемых свойствах также обновляются, но в моей форме я вижу старые данные.Но если я использую тег <input> вместо <b-form-input> компонента, данные в <input> обновляются нормально.Как я могу обновить данные в <b-form-input>?

<template>
<b-form @submit.prevent="saveWebintSet">
    <div class="form-row">
        <div class="col-lg-4 col-md-6 col-sm-12">
            <b-form-group
                label="Bind Port"
                label-for="bind-port"
                class="required">

                <b-form-input
                id="bind-port"
                v-model="web['bind-port']"
                v-input-mask v-bind:data-inputmask-regex="regExps.bindPort.pattern"
                type="text">
            </b-form-input>
            <div class="invalid-feedback"></div>
        </b-form-group>
    </div>
    <button type="submit" class="btn btn-primary mr-3">Save</button>
</b-form>
</template>

<script>
    export default {
        computed: {
            web: {
                get() {
                    return  this.$store.getters.GET_WEBINTF_SETTINGS;
                }
            },
         },
         methods: {
            saveWebintSet() {
                this.$store.dispatch('SAVE_WEBINTF_SETTINGS', this.web)
            },
        },
     }
</script>

1 Ответ

1 голос
/ 27 сентября 2019

Вычисляемые свойства являются односторонними и не должны использоваться в качестве v-модели (если вы не определяете их с помощью явных get и set методов): https://vuejs.org/v2/guide/computed.html#Computed-Setter.

Вы, вероятно, лучшеотключить использование свойства данных (переменной) для v-модели и предварительно заполнить его результатом получения вашего хранилища, а затем при отправке установить значение хранилища для свойства данных (переменной)

...