Programing

Vue: 계산된 속성의 초기 트리거링

c10106 2022. 5. 7. 09:24
반응형

Vue: 계산된 속성의 초기 트리거링

내 Vue 구성 요소에는 상태와 구성 요소를 감시하고 개체를 반환하는 계산된 속성이 있다.

        currentOrganization () {
            if (this.$store.state.organizations && this.selectedOrganization) {
                return this.$store.state.organizations.filter(org => org.id === this.selectedOrganization)[0];
            }
        }

불행히도 이 속성은 구성 요소가 로드될 때 자동으로 업데이트되지 않지만, 두 개 모두this.$store.state.organizations그리고this.selectedOrganization그러나 아래 선택 구성 요소를 통해 작업을 Vuex 저장소에 디스패치하면 업데이트된다.

                <b-form-select id="orgSelect"
                               v-model="selectedOrganization"
                               :options="this.$store.state.organizations.map(org => {return {value: org.id, text:org.name}})"
                               size="sm"
                               v-on:input="currentOrganizationChange()"
                               class="w-75 mb-3">
                    <template slot="first">
                        <option :value="null" disabled>Change Organization</option>
                    </template>
                </b-form-select>

구성 요소가 Vuex 작업을 디스패치하는 경우

            currentOrganizationChange () {
                this.$store.dispatch('setCurrentOrganization', this.selectedOrganization);
            },

어떻게 하면 만들 수 있을까?currentOrganization()처음에 계산하시겠습니까?

계산된 것은 당신이 그것을 사용할 때까지 계산되지 않을 것이다.

console.log또는 현재 조직을 작성하기만 하면 된다. 실행되어 계산되는 코드 어딘가에 :)

계산된 값이 항상 반환되는지 확인하십시오.린터가 그런 실수를 경고했겠지아마도 당신의 상태가 나빠지고 있을 것이다.this.selectedOrganization거짓이다

참조URL: https://stackoverflow.com/questions/54406063/vue-initial-triggering-of-a-computed-property

반응형