Vue.js 2, WATCH "Ошибка обратного вызова для наблюдателя" yourAccountsState ":" ReferenceError: значение не определено ""

Question

У меня есть следующее свойство WATCH, которое наблюдает за моими данными v-модели (это для флажков, и я использую bootstrap-vue).

Я думаю, что моя ошибка в том, как я устанавливаю значение в ЧАСАХ или как оно вызывается в моем магазине? (это проблема, потому что массив пересылается?)

Я могу утешить внутри ЧАСОВ, но при отправке я получаю сообщение об ошибке.

Вот разметка флажка:

<b-form-group label="Using sub-components:">
        <b-form-checkbox-group id="checkboxes1" name="flavour1" v-model="yourAccounts">
            <b-form-checkbox :value="test.value" class="card" v-for="test in filteredList" :key="bank.text">
                {{ test.text }}
            </b-form-checkbox>
        </b-form-checkbox-group>
</b-form-group>

свойство компьютера:

computed: {
    yourAccountsState: {
        get() {
            // console.log(this.yourAccounts);
            return this.yourAccounts
        },
    }
},
watch: {
    yourAccountsState(value) {
        this.$store.dispatch('setTestAccounts', value);

        console.log(value);
    }
}

В моем store.js из модуля импортировано следующее

        const state = {
    TestAccounts: []
}

const mutations = {
    // from v-modal on selected accounts page
    SET_SELECTED_TESTS (state, testAccount) {
        state.TestAccounts = testAccount
    }
}

const actions = {
    setTestAccounts: ({commit}) => {
        commit('SET_SELECTED_TESTS', value);
    }
}

const getters = {
    yourAccounts: state => {
        return state.TestAccounts
    }
}

export default {
    state,
    mutations,
    actions,
    getters
}

Answer 1

Если вы используете v-model, вам нужно дать Vue установщик, потому что v-model - это сокращенный метод, который выполняет v-bind и v-on за кулисами.

Если вы не предоставите установщик, наблюдатель не будет срабатывать так, как вы хотите. И вы должны убедиться, что свойство, которое вы присваиваете v-model, является массивом, чтобы значения могли быть сохранены, как описано в документации по bootstrap-vue.