vue-router跳转页面，URL变化但页面里的数据没变化，啥情况

Posted 2023-04-25

参考技术A localhost:8080/xname/1
localhost:8080/xname/2
xname.vue只created一次
怎样才能让1和2页面显示的数据不一样呢，
尝试了下watch $route，我的xname.vue代码如下：
created()
this.fetchdata();
,
watch:
'$route':'fetchdata'
,
methods:
fetchdata()
console.log("created")



但是这种方式会存在下面的问题页面进入的时候执行了一次fetchdata，页面离开的时候又执行了一次fetchdata，每次进入页面都得刷新数据，没有缓存 参考技术B localhost:8080/xname/1
localhost:8080/xname/2
xname.vue只created一次
怎样才能让1和2页面显示的数据不一样呢，
尝试了下watch $route，我的xname.vue代码如下：
created()
this.fetchdata();
,
watch:
'$route':'fetchdata'
,
methods:
fetchdata()
console.log("created")



但是这种方式会存在下面的问题页面进入的时候执行了一次fetchdata，页面离开的时候又执行了一次fetchdata，每次进入页面都得刷新数据，没有缓存本回答被提问者采纳

为啥vue的路由正常跳转，但页面没有变化

参考技术A

需求：点击注册按钮时，显示出注册页面
问题：地址正常跳转，但对应组件在对应位置没显示、也没报错？

解决：通过反复测试，后面发现有一条不显眼的警告消息：
[vue-router] Non-nested routes must include a leading slash character. Fix the following routes:...
大概意思是
非嵌套路由必须包含一个前导斜杠字符。
于是我在在定义路由路径path处修改了一下，解决成功！即： 在填写path时，前面需要将添加一个斜杠字符