programing

Vue.js 2, WATCH "워처 "Your AccountState" 콜백 오류: "ReferenceError: 값이 정의되지 않았습니다."

yoursource 2022. 8. 13. 12:39
반응형

Vue.js 2, WATCH "워처 "Your AccountState" 콜백 오류: "ReferenceError: 값이 정의되지 않았습니다."

다음과 같은 WATCH 속성이 내 v-model 데이터를 감시하고 있습니다(이것은 확인란용이며 bootstrap-vue를 사용하고 있습니다).

WATCH에서 값을 설정하는 방법이나 매장에서 WATCH 값을 부르는 방법 중 하나라고 생각합니다.(어레이가 전송되기 때문에 문제가 발생합니까?)

WATCH에서 콘솔은 할 수 있지만 디스패치하면 에러가 발생합니다.

체크박스의 마크업을 다음에 나타냅니다.

<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);
    }
}

my 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
}

사용하시는 경우v-modelVue에게 세터를 줄 필요가 있습니다.왜냐하면v-model를 실행하는 줄임말 메서드입니다.v-bind그리고.v-on막후에서

셋터를 제공하지 않으면 워처가 원하는 방식으로 트리거되지 않습니다.그리고 당신이 할당한 재산이v-model는 배열입니다.이것에 의해, Bootstrap-vue 문서에 기재된 대로 값을 보존할 수 있습니다.

언급URL : https://stackoverflow.com/questions/54047146/vue-js-2-watch-error-in-callback-for-watcher-youraccountsstate-referenceer

반응형