請告訴我
為什么通過props傳遞的資料在useLocation()中改變時沒有改變
我通過 Link 進行資料傳輸
<Link to={{ pathname: '/catalog/product_card/' product.id, state: { product } }}> <span className="product-name">{product.name}</span> </Link>我通過 ProductCardView 中的 useLocation 獲得它們
const CategoryViewDesktop = ({productState}:any) => { const product = productState.product; console.log(product) return ( <div>{product.id}</div> ) } const ProductCardView = () => { const { state } = useLocation() const productState = {products: state.products, product: state.product} console.log(state.product) return ( <Page page="catalog.products"> <CategoryViewDesktop productState={productState} /> </Page> ) }在 ProductCardView - 與 Link 互動時資料發生變化,但相同的資料來到 ProductCardInfo
為什么會這樣以及如何解決?
uj5u.com熱心網友回復:
因為您的變數productState不是反應式的,所以您可以直接在子組件 props 上使用鉤子useState或使用狀態。useLocation
const CategoryViewDesktop = ({productState}:any) => {
const product = productState.product;
console.log(product)
return (
<div>{product.id}</div>
)
}
const ProductCardView = () => {
const { state } = useLocation()
console.log(state.product)
return (
<Page page="catalog.products">
<CategoryViewDesktop productState={state} />
</Page>
)
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/415574.html
標籤:
