vue如何在store仓库中使用路由
更新时间:2022年03月30日 15:32:02 作者:吴冬雪~
这篇文章主要介绍了vue如何在store仓库中使用路由,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
在store仓库中使用路由
在仓库中,this的指向指的是store,但是在一般的工程,我们有可能会需要在仓库中走路由等逻辑,这个时候就需要先找到全局vue,因为路由是vue的一个子模块
main.js
window.Vue = vue const vue = new Vue({ el: '#app', store, router, render: h => h(App) }) window.Vue = vue export default vue
store/index.js
const _router = window.Vue.$router
actions: { getResourcesAsync ({commit}, path) { const _router = window.Vue.$router Vue.prototype.axios.post('/services/vp/motorcateUser/companyRoleResources/myResources', {}) .then((res) => { if (res.code === 200) { let resource = res.result var urList = steamroller(resource) var externalBtns = [] var ownBtns = [] sessionStorage.setItem('externalBtns', JSON.stringify(externalBtns)) sessionStorage.setItem('ownBtns', JSON.stringify(ownBtns)) commit('SET_RESOURCE', JSON.stringify(resource || {})) if (path) { if (urList.filter(item => item.granted && item.menuCode === path).length) { const currentRoute = urList.filter(item => item.granted && item.menuCode === window.Vue.$route.name) if (currentRoute.length) { _router.go(0) } else { _router.replace({name: 'concat'}) } } else { _router.replace({name: 'concat'}) } } } else { Vue.prototype.$message({ message: res.message, type: 'info' }) sessionStorage.removeItem('czb-sign-token') sessionStorage.removeItem('czb-sign-info') } }).catch(() => { sessionStorage.removeItem('czb-sign-token') sessionStorage.removeItem('czb-sign-info') }) } }
在js文件中使用vue的router和store
在js文件中引入vue的路由配置文件 或者 store文件
import store from '../store'; import router from '../router'; //直接使用即可 router.push({'path': '/'}) store.state.XXX;
以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。
相关文章
详解从vue-loader源码分析CSS Scoped的实现
这篇文章主要介绍了详解从vue-loader源码分析CSS Scoped的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧2019-09-09vue项目中运用webpack动态配置打包多种环境域名的方法
本人分享一个vue项目里,根据命令行输入不同的命令,打包出不同环境域名的方法。需要的朋友跟随小编一起看看吧2019-06-06
最新评论