当我用 react-router 更改页面时，渲染不适用于 React

问题描述

我想用我制作的 news.json 文件制作新的列表页面。

如下所示，在我用 ${item.id} 创建链接 href 的同时，用地图制作列表

item.is 代表 news1、news2、new3.. 等等，我让每个 new1.js、new2.js 都与它链接。

但是当我这样做时，它没有显示任何身体。我认为渲染有问题。

我已经用谷歌搜索过了，发现了 stackoverflow 帖子，上面说路由器需要密钥.. 类似的东西，但我还是不明白。

我如何更改代码？？？

const NewWrap =()=>{
  const articleWrapper = news.map((item)=>{
    return(
      <Li key ={item.id}>
        
        <img src={item.img} alt="img"  style ={{width:"260px",height:"200px",padding:"1rem"}}/>
        **<Link to={`/${item.id}`}** style={{textDecoration:"none",color:"black"}}>
          <div style={{padding:"1rem",textAlign:"left",cursor:"pointer"}}>
            <p>{item.title}</p>
            <p>{item.content.substring(0,305)}...</p>
            <p >{item.date}</p>
          </div>
        </Link>
      </Li>
      
      )
    });
    return(
      <Ul>
      {articleWrapper}
    </Ul>
  )
}

const News = () => {
  
  return (
    <div>
     
      <ImgBox>
        <Img src ="../img/bg_mian_01.png"/>
        <ImgText>News and Partners</ImgText>
      </ImgBox>
      
      <ConBox>
        <Subtitle>NEWS</Subtitle> 
        <NewWrap/>

      </ConBox>
      <Switch>
        <Route path="/new1" component={New1}/>
      </Switch>
    </div>
  
  );
};

export default News;

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）