使用反应重定向将道具传递给另一个组件

Question

我有以下代码

if (_get(this.state, 'showCheckoutSuccess') == false) {
            alert("Order Failed: Not Enough Credits");
            return <Redirect push to={{
                pathname: '/view-cart',
            }} />;
        }

它最初所做的只是在重定向后显示一个弹出窗口。但我希望能够将 showCheckOutSuccess 信息传递给该组件以在页面的一行上显示一条消息。

我没有任何运气我尝试做的是：

if (_get(this.state, 'showCheckoutSuccess') == false) {
                return <Redirect push to={{
                    state: { showCheckoutSuccess: "false" }
                    pathname: '/view-cart',
                }} />;
            }

然后使用 this.props.location.state.showCheckoutSuccess

当我通常导航到购物车页面时，这会导致错误，并显示 showCheckoutSuccess 未定义。

我认为这是因为信息从未传递给它，但即使从未出现此错误，用户仍应能够访问购物车页面。

Answer 1

你需要 redux 或其他一些状态管理器（React Context 也可以）。

或者你可以使用历史钩子。

history.push({
  pathname:"/view-cart",
  state:{
    showCheckoutSuccess: "false"
  }
});

然后像 props.location.state.showCheckoutSuccess 一样访问它。