欢迎关注微信公众号:【 全栈攻略 】

Classic mode for store/ is deprecated and will be removed in Nuxt 3.解决方案

出现这个的原因是 vuex经典模式写法将在Nuxt 3中删除
 if (typeof store === 'function') {
    const log = (process.server ? require('consola') : console)
    return log.warn('Classic mode for store/ is deprecated and will be removed in Nuxt 3.')
  }
从代码中我们可以看出,它对store做了一个是否是function的判断,如果我们export的是一个function就会出现本文中的警告信息,而且代码阻塞了,解决方案是以前的经典模式写法不再支持

新版变化之处:

  1. 不需要 modules 目录,所有 modules 直接写出 xxx.js 就是模块了。
  2. index中不需要 vue.use(vuex) 等模板代码了,全部由 nuxt 完成。
  3. .action 需要自己写,默认 nuxt会自动配置生成。直接调用即可。

接下来需要我们改写一下

首先是store.js改写
 export const actions = {
      async nuxtServerInit({
        commit
      },{req,app}) {
        const {status,data: {province,city}} = await app.$axios.get('/geo/getPosition')
        commit('geo/setPosition',status===200?{city,province}:{city:'',province:''})      
        const {status:status2, data: {menu}} = await app.$axios.get('/geo/menu')
        commit('home/setMenu',status2===200?menu:[])
      }
  }
具体模块写法 如 geo.js
const state = () => ({position: {}})

const mutations = {
  setPosition(state, val) {
    state.position = val
  }
}

const actions = {
  setPosition: ({
    commit
  }, position) => {
    commit('setPosition', position)
  }
}

export default {namespaced: true, state, mutations, actions}
Logo

前往低代码交流专区

更多推荐