I am having an issue with an object/date passed to a component on route with history.push, ex:
<IonRouterLink onClick={ (): void => { history.push({ pathname: '/product-quantity', state: { product: result } }) } }>
<ButtonComponent>Calculate Quantity</ButtonComponent>
</IonRouterLink>
On the component that I am routing to I have the following:
const ProductQuantity: FunctionComponent<RouteComponentProps<{}, {}, Product>> = ({ location }: RouteComponentProps<{}, {}, Product>) => {
const product = location.state.product;
......
The above works fine when navigating to said component, but when navigating back product becomes undefined and breaks the view throwing the following error:
There is a work around but doesn’t seem like a proper thing to do. By adding location.state?.product and doing the same thing to everything reference of a property from the product object, I can avoid this issue but it’s clunky.
I think what needs to happen is that on unmount the component doesn’t need re-render, I just know how to go about doing that or if it’s even possible.