実施内容

3-3 Listコンポーネントを作成しよう

気付き

• コンポーネント配置図があると、「現在地」や「これから作成するコンポーネント」の把握がしやすい。
  https://www.techpit.jp/courses/24/curriculums/25/sections/212/parts/756

• $store.dispatchでstore/index.jsにあるactionsの呼び出し
  第一引数にメソッド名

・入門者必読、vue.jsの状態管理Vuexがわかる
https://reffect.co.jp/vue/understaind-vue-basic

• mapヘルパー
  mapActions, mapMutations, mapState, mapGettersがある。

・vue.jsの状態管理VuexがわかるmapState,mapMutationsなど
https://reffect.co.jp/vue/vue-js-vuex-map-helper

疑問点

• 第二引数には何が入っているのか？
  →console.logで確認する

methods: {
    removeList() {
        if(confirm('本当にこのリストを削除しますか？')) {
            this.$store.dispatch('removelist', {listIndex: this.listIndex})
        }
    }
}

• mapヘルパーの使い方
• mapヘルパーは記述省略のためのもの？

エラー

※単純にpropsの書き忘れだった。記述後エラーは消えた。

[Vue warn]: Property or method "title" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.

found in

---> <List> at src/components/List.vue
       <Board> at src/components/Board.vue
         <App> at src/App.vue
           <Root>