나는 유사한 제목의 질문을 이미 읽었지만 그 복잡성 때문에 그 질문을 따르지 못합니다. 나는 내 코드로 나를위한 해결책을 찾는 것이 더 쉬울 것이라고 생각한다. 관련 코드 만 포함합니다.
내 상점은 입니다. obs : vuex 플러그인을 설치했습니다.
import Vue from 'vue';
import Vuex from 'vuex';
Vue.use(Vuex)
const state = {
titulo: "please, change title"
}
const mutations = {
changeTitle(state, title) {
state.title= title
}
}
export default new Vuex.Store({
state : state,
mutations : mutations
})
내 App.vue
<template>
<div>
<show-title-component ></show-title-component>
<change-title-component></change-title-component>
</div>
</template>
<script>
import ShowTitleComponent from './components/ShowtitleComponent';
import ChangeTitleComponent from './components/ChangeTitleComponent';
import store from './vuex/store';
export default {
components: {ShowTitleComponent, ChangeTitleComponent},
store,
data: function() {
return {title: 'placeholder'}
}
}
</script>
오류를 생성하는 구성 요소 :
<template><div>{{ title}}</div></template>
<script>
export default {
name: "show-title-component",
computed: {
title() {
return this.$store.state.title /** error here */
}
}
}
</script>
012. main.js에 포함시켜야합니다. – Traxo
'new Vue'를 호출하는 항목 파일에 포함 시키십시오. –
지식을 수정했는지 확인하기 위해 책을 다시 읽는 중입니다. 나는 필자의 것과 비교해 코드 불일치를 발견하지 못했다. 내가 잘못했던 유일한 점은 저장소 파일에 .vue 파일을 지정하는 것이 었습니다. 내가 그것을 .js (store.js)로 바꾼 후에도 효과가있었습니다! –