使用param.id刷新反应路线时,图像在浏览器中消失

时间:2018-10-31 08:27:48

标签: html reactjs react-router

我正在使用html <img>来显示图像。但是,当刷新带有this.props.history.push('master/'+id)之类的带有参数(即=> localhost:3000/master/1)的路由网址时,浏览器中的所有图像都会消失。我曾尝试使用Google搜索该问题,但没有找到需要更改的地方。

带有参数URL的页面之前的图像正在刷新:

image before

带有参数URL的页面后的图像正在刷新:

image after

图片代码的代码:

<Toolbar>
 <img src="./imgs/icon@32.png" alt="" height="32" className={classes.appBarIcon} />
  <Typography variant="h6" component="h1" color="inherit" noWrap>
                        {APP_NAME}
  </Typography>
   <div className={classes.grow} />
    <div className={classes.sectionDesktop}>
     <IconButton onClick={() => this.handleMenuClick("/me")}> 
       <Icon className={classes.menuIcon}>account_circle</Icon>
     </IconButton>
    </div>
   </Toolbar>

URL代码更改:

handleRowClick = (id) => {
    this.props.history.push('master/'+ id);
}
<TableBody className={classes.tblBody}>
 {this.props.data.slice(this.state.page * this.state.rowsPerPage, this.state.page * this.state.rowsPerPage + this.state.rowsPerPage).map(item => {
   return (
    <TableRow key={item.id} onClick={() => this.handleRowClick(this.props.path,item.id)} hover>
       <TableCell>{item.id}</TableCell> 
       <TableCell>{item.name}</TableCell>
       <TableCell>{item.description}</TableCell>
    </TableRow>
    );})}
</TableBody>

0 个答案:

没有答案