极客观点
项目管理
HarmonyOS
点击这个按钮应该跳到添加的页面
这是按钮
这是路由
点第一遍这个按钮的时候控制台什么也没有,再点一次就出现异常了
vue-router.esm.js?8c4f:2085 Uncaught (in promise) NavigationDuplicated {_name: "NavigationDuplicated", name: "NavigationDuplicated", message: "Navigating to current location ("/addMember") is not allowed", stack: "Error↵ at new NavigationDuplicated (webpack-int…node_modules/vue/dist/vue.runtime.esm.js:2178:14)"}_name: "NavigationDuplicated"name: "NavigationDuplicated"message: "Navigating to current location ("/addMember") is not allowed"stack: "Error↵ at new NavigationDuplicated (webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:2009:14)↵ at HTML5History.confirmTransition (webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:2125:18)↵ at HTML5History.transitionTo (webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:2069:8)↵ at HTML5History.push (webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:2400:10)↵ at eval (webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:2812:22)↵ at new Promise (<anonymous>)↵ at VueRouter.push (webpack-internal:///./node_modules/vue-router/dist/vue-router.esm.js:2811:12)↵ at VueComponent.addMember (webpack-internal:///./node_modules/cache-loader/dist/cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/main/accountBookModule/item/operationMember.vue?vue&type=script&lang=js&:13:20)↵ at invokeWithErrorHandling (webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:1853:26)↵ at VueComponent.invoker (webpack-internal:///./node_modules/vue/dist/vue.runtime.esm.js:2178:14)"__proto__: Error
eval @ vue-router.esm.js?8c4f:2085
abort @ vue-router.esm.js?8c4f:2116
confirmTransition @ vue-router.esm.js?8c4f:2124
transitionTo @ vue-router.esm.js?8c4f:2068
push @ vue-router.esm.js?8c4f:2399
eval @ vue-router.esm.js?8c4f:2811
push @ vue-router.esm.js?8c4f:2810
addMember @ operationMember.vue?5b0b:13
invokeWithErrorHandling @ vue.runtime.esm.js?2b0e:1854
invoker @ vue.runtime.esm.js?2b0e:2179
invokeWithErrorHandling @ vue.runtime.esm.js?2b0e:1854
Vue.$emit @ vue.runtime.esm.js?2b0e:3888
handleClick @ element-ui.common.js?5c96:9412
invokeWithErrorHandling @ vue.runtime.esm.js?2b0e:1854
invoker @ vue.runtime.esm.js?2b0e:2179
original._wrapper @ vue.runtime.esm.js?2b0e:6917最后在网上找的一个修改路由的push方法也不管用
const routerPush = VueRouter.prototype.push
VueRouter.prototype.push = function push (location) {
return routerPush.call(this, location).catch(error =>error)
}按钮的代码:
<template>
<el-row>
<el-button size="small" type="success" @click="addMember">新增</el-button>
<el-button size="small" type="danger">删除</el-button>
</el-row>
</template>
<script>
export default {
name: 'operationMember',
methods: {
addMember () {
this.$router.push({ path: '/addMember' })
}
}
}
</script>
<style lang="scss" scoped>
</style>
然后是addMember页,这里面现在还什么都没有:
<template>
<div>asd</div>
</template>
<script>
export default {
name: 'addMember'
}
</script>
<style lang="scss" scoped>
</style>
最后成功的样子是这样的:
路由里是这样写的:
{
path: '/addMember',
name: 'addMember',
components: { addMember: () => import(/* webpackChunkName: "group-foo" */'../addMember') }
},router-view这边是这样的:
最后谢谢各位大佬的帮助,感谢大家
router-viewrouter-linkrouter-link(:to="{name: 'member.new'}")