javascript - 如何在分割的 (vuex) getters.js 文件中访问 $route？

Question

我使用 vuex 作为分割的(getters.js、mutations.js、actions.js、state.js)文件，并且我想在分割的 getters.js 文件中使用 $route 插件变量。实际上，我之前将它们全部使用，但我切换到 quasar，而 quasar 建议以某种方式在分割文件中使用 vuex 模块。好吧，这并不是建议，但它有一个例子。我知道我可以用旧的方式使用它，但我想尝试一下，由于我缺乏知识，我不确定。所以就像:

└── store
      └─ routes
          ├── state.js
          ├── actions.js
          ├── mutations.js
          ├── getters.js
          └── index.js

在index.js中它们都被绑定(bind)如下:

import state from './state'
import * as getters from './getters'
import * as mutations from './mutations'
import * as actions from './actions'

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

在 getters.js 文件中，我导出 const 我以前使用的函数。但我需要访问其中之一中的 $route 插件。

export const current_route = state => {
    return this.$route;
}

顺便说一句，我也知道我可以在需要的地方直接使用 this.$route (不使用 vuex getter)，但我只是想知道如何访问这些变量(或者即使有可能) )在这些分割的文件中。

Answer 1

下面是vue-router的源码:

  Vue.mixin({
    beforeCreate () {
      if (isDef(this.$options.router)) {
        /* something else */
        Vue.util.defineReactive(this, '_route', this._router.history.current)
      } else {
        this._routerRoot = (this.$parent && this.$parent._routerRoot) || this
      }
      /* something else */
    }
  })

  Object.defineProperty(Vue.prototype, '$route', {
    get () { return this._routerRoot._route }
  })

如您所见，$route 是$router.history.current 的别名。所以你可以直接导入router:

import router from 'path/to/your/router'
export const current_route = state => {
  return router.history.current
}