1.0.0 • Published 4 years ago
@livzon/navigation v1.0.0
Navigation
扩展
history
路由跳转的功能,整个应用关于导航相关的操作都应该使用navigation
路由跳转案例
// 直接跳转
navigation.push("/url");
// 跳转携带 state
navigation.push("/url", { name: "jack" });
// 跳转携带 query, query 对象会生成 search 字符串,替换原本的 search 字段
history.push({
pathname: "/url",
search: "?name=jack&age=20",
});
// vs
navigation.push({
pathname: "url",
query: {
name: "jack",
age: 20,
},
});
// 同上
navigation.replace({
pathname: "url",
query: {
name: "jack",
},
});
// 前进后退
navigation.go(-1);
navigation.goBack();
navigation.goForward();
// 页面跳转保存数据,详情查看下面章节
navigation.pushKeepCache("/url", query);
跳转保存当前路由数据数据
// 1. 组件加载时获取缓存的数据
const cache = navigation.cache.popItem<Cache>(cacheKey);
// 2. 页面跳转之前存储数据
navigation.cache.setItem(cacheKey, data);
navigation.pushKeepCache("/url", query);
// 3. 组件卸载清除
navigation.cache.removeItem(cacheKey);
注意
原有上层业务代码已近被移除。如果有需要可以参照一下方式执行实现跳转到登陆页
/**
* 导航到登录页面
* @description 使用 location.href 跳转到登录页,这样会走 nginx 服务器重定向
*/
export function toLoginPage(clear?: boolean, force = false) {
if (clear) {
localStorage.removeItem('token')
localStorage.removeItem('refreshToken')
}
if (force || !navigation.history.location.pathname.startsWith('/login')) {
navigation.history.replace('/login')
}
// window.location.href = '/login'
}