nuxtjs how to introduce store and router in a separate js file

  nuxtjs inside an integrated way to create vuex changed, and the official is not recommended to create a way to export Vuex instance store, and will be removed in nuxt3 inside. This will there is a problem, how I like ordinary vue spa items as direct import store from '@ / store' it?

  Although the official recommended a write plugins for this js, then used inside plugins

export default ({ app, $axios, store, route, redirect }) => {
  ...  
}

  While there may indeed get to, in most cases this is indeed the case. But the total has those exceptions need to reference how to do it in a separate js inside? And I really met, because in a spa before the project form, then do platform, need to rely on seo, you can only turn ssr rendering. The project is not small, the content contains very much into the whole ssr, and not enough time period, then it is surely the more smooth transition as possible, try to avoid a lot of changes. Then you do encounter this problem, it is necessary to introduce store and router in a separate js file.

  Because the store instance nuxt creation and exports did not come out, so it can not directly import. Before tried many methods, such as:

1, because nuxt in the vuex way is to create a state exported function, getters and so is exported directly, then try

State} {Import from  ' @ / Store / The index.js ' 

// time requires use 
state (). pick

  But this way acquired value is always null, which is obviously wrong. The reason is that it is possible to export only variable, but not in this store instances of this state, resulting in obtaining less than the value, do not know the correct understanding. So keep looking program.

2, online search:

  You can hack it, after obtaining an assignment from the unit to a local store to save up

  You can also write a plugin, plugin at the time of execution to save up store

  I did not specifically tried to be feasible

3, after the instance initialized nuxt will be injected in the window global $ nuxt,. $ Store can access the store through $ nuxt, $ nuxt. $ Router has access to the router, it should be noted that, initialized previously inaccessible $ nuxt of Therefore in order to use this method you need to initialize after completion.

  const store = $nuxt.$store
  const router = $nuxt.$router

 

Guess you like

Origin www.cnblogs.com/goloving/p/11440880.html