I'm practicing NUXT and from tutorial its working well. mine fail when entering the NUXT middleware. the logic is if page is redirecting to other page it will enter middleware and fetch the result using axios.
middleware/search.js
import axios from 'axios';
export default function ({ params, store }) {
console.log(store)
return axios.get(`https://itunes.apple.com/search?term=~${params.id}&entity=album`)
.then((response) => {
console.log(response.data.results);
store.commit('add', response.data.results)
})
}
when entering here the store.commit('add'...
will result
Cannot read property 'commit' of undefined
when I echo commit = undefined.
What I'm missing? I already tried this.$store.commit(...)
still undefined.
store/index.js
import Vuex from 'vuex'
const createStore = () => {
return new Vuex.Store({
state: {
albums: []
},
mutations: {
add (state, payload) {
state.albums = payload
}
}
})
}
export default createStore
I found a solution from the comments of the said tutorial but I want to share here if others struggle it too.
halt your development server ctrl+C
then restart the your dev server
npm run dev
then VUEX will be seen now in the middleware tnx