学习vue的时候遇到了一个路由的问题.首先自己刚开始学,确实太菜了…

这个问题就是使用this.$router.push添加了跳转的路由地址,router那边也添加了跳转的vue组件,结果点击这个按钮没有发生跳转,但是地址栏的地址已经发生了变化,再次点击按钮的时候会报错:

这个错误是因为不能跳转当前地址.

然后是我在网上看到很多人用了一个改写路由的push方法:

const routerPush = VueRouter.prototype.push
VueRouter.prototype.push = function push (location) {
   return routerPush.call(this, location).catch(error => error)
}

这个方法在我这里没有发生作用…

然后我又在网上寻求帮助,遇到一位大佬,他告诉我说:

1.首先，你要记得在父容器里使用 router-view
2.其次，链接应该用 router-link
3.链接应尽量用名称，不要用实际路径，方便维护
4.所以这里你应该写成 router-link(:to="{name: ‘member.new’}")
5.报错本身是正常的

然后我才意识到我没有使用router-view,我又问了一下,确实这个是必须要有的.

最后我加上router-view之后还是没有成功,于是我又按照之前在网上看到的一个方式:

1.给router-view 添加一个name属性
2.再路由中把component属性改为components,多了一个s
3.components属性是一个对象里面需要有一个属性,属性名就是上面router-view 中添加的name的值,然后属性值就指向要跳转的vue组件

到这里就把问题解决了,至于为什么要把component改成components,其实我也不知道…

接下来就是我寻求帮助的全过程