Storeにjsonから取得したデータを配列として保管してるのですが、mountedでconsoleから見るとobserverになりアクセス出来ません。
Nuxt.jsのstore/works.jsです。
store
1import axios from 'axios' 2 3export const state = () =>({ 4 jsonURL: "http://localhost:3000/projects.json", 5 worksData:[] 6}) 7export const actions = { 8 async getWorkData(context){ 9 let response = await this.$axios.$get(context.state.jsonURL) 10 context.commit("setWorkData",response) 11 } 12} 13export const mutations = { 14 setWorkData(state,response){ 15 state.worksData = response 16 } 17}
pages/works/_id.vueです。
script
1export default { 2 created() { 3 this.$store.dispatch("works/getWorkData"); 4 }, 5 mounted(){ 6 console.log(this.$store.state.works.worksData); 7 } 8};
console.log(this.$store.state.works)時点では配列にデータが入っていることが確認できるのですが、worksDataまでアクセスするとlengthが0になり何も取得できない状態です。
参考画像です。
1枚目が console.log(this.$store.state.works)
2枚目が console.log(this.$store.state.works.worksData)
回答3件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/04/12 01:54 編集
2019/04/12 11:21 編集