CJY0208/react-activation

[Bug] 断层造成的 react-router 中 withRouter/hooks 功能异常

CJY0208 opened this issue · 0 comments

问题

@CHEN-J-H 微信沟通发现此问题

由于 react-activation 形成了组件断层,处于 KeepAlive 中的组件将无法获取到 Route 所处上下文环境中的 match 等信息,造成 withRouter/hooks 等依赖上下文环境的功能异常

如下示例中,Item 组件将无法通过 withRouter 或 useParams 获取到 match 当中的 params.id 信息

image


解决方案

目前无法在 activation 内部无感知解决,需要手动做如下兼容处理

<Route
  exact
  path="/item/:id"
  render={(props) => (
    <KeepAlive>
+      <Route computedMatch={props.match}>
        <Item />
+      </Route>
    </KeepAlive>
  )}
/>

image

经过测试的 router 版本:

  • v4.3.1
  • v5.2.0

在线示例地址:https://codesandbox.io/s/santi-demo-forked-2i9gz