React缓存(获取历史路由/堆栈)

今天收到一个bug说是页面详情返回之后页面应该保持原本的数据样子，我一想这不就是keep-live吗

于是乎，去搜React的Keep-Live怎么实现，看到一位大佬封装的组件https://blog.csdn.net/zz130428/article/details/128275281

有点看不懂，后来想到一条思路，判断上一个页面的路由是不是详情页的路由，然后提前把页面的查询条件存储起来，如果进入这个页面时候的上个路由时详情页的，那就拿到存储起来的条件去渲染页面，达到一个缓存的效果。

问题来了，找了半天也没找到怎么拿到上一个页面的路由，知道在这里的评论区看到一位大佬的回复https://www.saoniuhuo.com/question/detail-2390072.html

是我无知了！

然后，找了一个自定义保存历史堆栈的例子，我，行不通，也有点看不懂。

我心想，算了，我自己写吧，想了一通是这么实现的

1. 首先layout组件里监听路由变化

const [pathHistory, setPathHistory] = useState([]);
const { pathname } = useLocation();
  useEffect(() => {
    pathHistory.unshift(pathname);
}, [pathname]);

2. 然后在layout通过context传递下去

3. 最后在用到的组件中监听变化然后做相应处理即可