データ管理にvuexを使ってみることにしました。
今回の記事ではまださわりしかできていないので、そのさわりでちょっと詰まってしまったことについて備忘録代わりに書いていきます。
こちらの記事をチュートリアル代わりに勉強しています。
vuexをインストールして上記の記事のようにHello Vuexを表示させようとしたのですが、こちらのエラーが出てページが表示されませんでした。
"TypeError: Cannot read property 'state' of undefined"原因としては非常に単純で、main.jsにvuexを書いていなかったせいでした。
以下のようにmain.jsにvuexを追加し、無事表示されるようになりました。
import Vue from 'vue'
import App from './App.vue'
import vuetify from './plugins/vuetify'
import router from '../router'
import VCalendar from 'v-calendar'
import axios from 'axios'
import VueAxios from 'vue-axios'
import store from "./store/index.js";
Vue.config.productionTip = false
Vue.use(VueAxios, axios)
Vue.use(VCalendar);
new Vue({
router,
vuetify,
store,
render: h => h(App),
}).$mount('#app')
現在は一覧データの取得に使用しようと、修正を進めています。
この『VueでWEBアプリ』シリーズのコードをgithubで公開しています。参考までに。