vue中怎么在进入路由之后进行判断？

Posted 2023-03-24

跟着视频学习VUE搭建项目，但有些地方不了解。现在想做这个功能，
在进入购物车页面时候，进行判断，如果购物车中没有商品，那就提示“购物车中没有商品”，如果购物车中有商品那就不提示，
这个要怎么弄，

进入购物车页面的时候，可以在 mounted 方法里面判断你的购物车数据，并不需要在路由里面判断呀：

//...
<div v-if='shoppingList.length > 0'>
    // 显示购物车列表
</div>
<div v-else>
    <p>购物车中没有商品</p>
</div>

在进入该页面的时候，通过判断你的购物车列表即可

参考技术A 进入路由页面
mounted()
this.$nextTick(()=>
show();
)

离开路由页面后执行函数
destroyed: function ()
console.log("我已经离开了！");
this.stopTimer();
,
说明：destroyed是与methods、mounted同层级的
mounted()
this.startTimer();
,
//离开当前页面后执行
destroyed: function ()
this.stopTimer();
, 参考技术B 在生命周期create函数里写
create()
if(!shop.length) //提示

追问

create()
if(!this.goodsCount)
console.log(1)
else
console.log(2)


不行啊，1和2都不打印

追答

以后问这种问题，把代码全部发出来，别让我们瞎J八猜

追问

换成mounted()就有提示了，

但又有个问题，

路由里面path: 'cart', name: 'cart', component: Cart, meta: keepAlive: true ，

不能加这个meta: keepAlive: true ，否则就只有第一次进入有提示，

但如果不加这个

就会渲染两次，有什么解决办法么？

追答

这个问题，不是路由问题，你代码肯定有问题

Vue实现登录拦截

参考技术A 我们知道，许多页面在进入之前都是需要进行登录验证的。如果用户没有登录，则用户访问这些网页时直接跳到网站登录页。Vue的登录拦截主要通过router的配置实现。

requireAuth属性作用是表明该路由是否需要登录验证，在进行全局拦截时，我们将通过该属性判断路由的跳转，该属性包含在meta属性中:

beforeEach是router的钩子函数，该函数在进入每个网页之前调用，该函数接受三个参数:

参考博客:
【vue+axios】一个项目学会前端实现登录拦截