์คํ ์ด ๋ชจ๋ํ ์ ...mapState
์ ๋ todoApp.js ๋ชจ๋์ ์๋ headerText๋ฅผ ์ ๋ฌํด์ฃผ๋ getters ํจ์๋ฅผ ํ๋ ๋ง๋ค์ด์ ์ ๋ฌํ๋ ๋ฐฉ์์ผ๋ก ํด๊ฒฐํ์ด์!storedTodoItems() ๋ก todoItems๋ฅผ ์ ๋ฌํด์ ๋ฆฌ์คํธ๋ฅผ ๋ฟ๋ ค์ค ๊ฒ์ฒ๋ผ์. // todoApp.js const state = { headerText: 'My TODO', todoList: storage.fetch(), }; const getters = { getHeaderText(state) { return state.headerText; }, storedTodoItems(state) { return state.todoList; }, }; // TodoHeader.vue {{ this.headerText }} import { mapGetters } from 'vuex'; export default { computed: { ...mapGetters({ headerText: 'getHeaderText', }), }, };