时间戳

首页 > 解决方案 > 路由不会因不同的参数 ID 而改变，即使密钥不同

javascript - 路由不会因不同的参数 ID 而改变，即使密钥不同

问题描述

我有一个反应路由器应用程序，到目前为止只有两条路由。

<Router history={history}>
        <div>
      <Switch>
      <Route exact path="/" component={Homepage} />
      <Route path="/pdfviewer/:index" component={PdfViewer} />
      </Switch>
      </div>     
      </Router>

在我的侧边栏中，我将所有组件映射为PdfViewer这样

const files = data.map((file, i) =>{
      return(
        <FileItem file={file} key={`${i}`} name={`file number ${i+1}`} index={i+1} /> 
        )
    })

在每个内部FileItem我都有一个 NavLink 来呈现给具有给定索引的组件。

<ListItem button component={Link} to={{pathname:`/pdfviewer/${index}`, state: {fileObject: fileObject, fileLineObjects: fileLineObjects}}}>
        <ListItemIcon>
          <AssignmentIcon />
        </ListItemIcon>
        <ListItemText primary={name} />
      </ListItem>

每当路线更改时，都不会安装新组件，但是当我重新加载浏览器时，站点会更新。当我为每个组件提供新密钥时，为什么会发生这种情况？

标签： javascriptreactjsreact-router

解决方案

推荐阅读