React项目
实现方案:
1.在路由监听处获取到当前页面的URL,以URL为key值,以访问次数为value,生成一个对象。
2.把生成的对象的经过处理,用localStorge存储到本地。
3.进入页面时,现获取本地数据。
4.对本地数据进行处理,获取访问次数最多的URL
5.显示出URL
关键代码
//获取存储的数据
const localStorageUrl = localStorage.getItem('urlCount');
// 循环找出被访问次数做多的URL(找出最大value对应的key值)
var maxRouter = Object.keys(urlCount).reduce(function(p: any, n: any) {
if (urlCount[p] < urlCount[n]) {
return n;
}
return p;
});
// 存储每个URL被访问的次数
const localStorageUrl = localStorage.getItem('urlCount');
let urlCount: any = localStorageUrl ? JSON.parse(localStorageUrl) : {};
if (Object.keys(urlCount).includes(location.pathname)) {
assign(urlCount, {[location.pathname]: ++urlCount[location.pathname]});
}else{
assign(urlCount, {[location.pathname]: 0});
}
localStorage.setItem('urlCount', JSON.stringify(urlCount));