@BastianVoigt. Правильно, это то, что делает вышеуказанное условие Текущий productID (this.props.producID) будет иметь новый porductID, который мы сказали в переменной состояния. Если мы сравним это, то оно всегда будет равным
я есть «домашний» компонент со ссылками, и когда вы нажимаете на ссылку, компонент продукта загружается вместе с продуктом. У меня также есть другой компонент, который всегда виден, показывая ссылки на «недавно посещенные продукты».
Эти ссылки не работают, когда на странице продукта. URL обновляется, когда я нажимаю на ссылку, и происходит рендеринг, но компонент продукта не обновляется с новым продуктом.
Смотрите этот пример:Пример Codesandbox
Вот маршруты в index.js:
<BrowserRouter>
<div>
<Route
exact
path="/"
render={props => <Home products={this.state.products} />}
/>
<Route path="/products/:product" render={props => <Product {...props} />} />
<Route path="/" render={() => <ProductHistory />} />
<Link to="/">to Home</Link>
</div>
</BrowserRouter>;
Ссылки в ProductHistory выглядят так:
<Link to={`/products/${product.product_id}`}> {product.name}</Link>
Таким образом, они соответствуютRoute path="/products/:product"
.
Когда я нахожусь на странице продукта и пытаюсь перейти по ссылке ProductHistory, URL обновляется и отображается, но данные компонента не меняются. В примере Codesandbox вы можете раскомментировать предупреждение в функции визуализации компонентов продукта, чтобы увидеть, что оно отображается при переходе по ссылке, но ничего не происходит.
Я не знаю, в чем проблема ... Можете ли вы объяснить проблему и найти решение? Это было бы прекрасно!