您好,由于某种原因,我遇到了一个问题,图像无法在带有参数的路线上加载。然而,在任何没有参数的路线上,它们加载得很好。
例如我加载路线 '/product/:id';
该路由的组件包含此
class Product extends Component {
constructor(props) {
super(props);
this.state = {
product: null
}
}
componentDidMount() {
this.fetchProduct();
}
fetchProduct() {
const { id } = this.props.match.params;
axios.get(`/api/product/${id}`).then(function (response) {
this.setState({ product: response.data });
}.bind(this));
}
renderProduct() {
let { product } = this.state;
if (!product) {
return false
}
else {
return (
<div className='row'>
<div className='col-md-5'>
<img src={product.main_img} />//this image is not displaying
<h5>{product.title}</h5>
<p>{product.description}</p>
</div>
<div className='col-md-5'>
<Form product={product}/>
</div>
</div>
)
} …Run Code Online (Sandbox Code Playgroud)