Javascript 在新路由onClick-React JS中呈现动态数据

我想渲染

handleCrawl（）

onClick。它必须走另一条路线。 当前我的路线更改，但我无法呈现

。我不知道如何将

handleCrawl（）

传递给另一个函数

此函数处理单击事件以显示一段数据

 handleCrawl = e => {
  const { id } = e.target;
  this.setState(current => ({
    showCrawl: { [id]: !current.showCrawl[id] }
  }));
};

这是我的渲染方法，它映射要单击和渲染的链接列表

 render() {
  return (
      <div>
        {this.state.apis.map(api => (
      <NavLink to={`api/${api.id}`} key={api.id}
         id={api.id}
          onClick={this.handleCrawl}>{api.title}</NavLink>
          ))}
      <div>
      {this.state.apis.map(api => (
        <div
          key={api.id}
          id={api.id}>
          {this.state.showCrawl[api.id] && (  
            <SwaggerUI url={api.opening_crawl}/>
          )}
        </div>
      ))}
    </div>
    </div>
  );
}

render（）{
返回(
{this.state.api.map（api=>(
{api.title}
))}
{this.state.api.map（api=>(
{this.state.showCrawl[api.id]&&&（
)}
))}
);
}

您在这里混合了路由和状态。只需创建一个导航链接，将路线更改为

api/：id

。无需调用

handleCrawl

。另外，

state.showCrawl

可以替换为

this.props.match.params.id

。如果您需要对路由更改执行API请求，您可以创建一个

fetchData

方法，并在

componentdiddupdate

和

componentDidMount

生命周期方法中调用它。@AWolf，im get

无法读取未定义的属性“params”

错误。我需要在任何地方设置参数吗。我是新来的，很抱歉，我反应太晚了。你能帮我做一个最小的然后我可以看看吗？不确定为什么组件中没有参数，如果看不到完整的代码，就很困难。