Javascript 在反应挂钩中设置设置状态

我在

PageOne.tsx

中有两个按钮

create signature

和

create delivery

，当状态为

InDelivery

时，这两个按钮都可见

我的重点是如何在开始时隐藏

Create delivery

按钮，但当用户单击

Create signature

按钮（位于

PageTwo

中）并在该页面内单击

Submit

按钮时，该按钮会将用户带回该

PageOne.tsx

那么这里只有

Create delivery

按钮应该是可见的，如果有人使用我的代码并提供工作示例，（我是新手）我的代码：

import React，{ReactNode，useContext，useffect，useState}来自“React”；
导出函数第1页（道具：React.PropsWithChildren）{
const[delivered，setdelivered]=useState（false）；
常量重定向到符号=（）=>{
SetDelivered（真）；
history.push（“/PageTwo/”+orderId）；
};
const RedirectToDeliv=（）=>{
history.push（“/PageThree/”+orderId）；
};
常量签名按钮=（）=>{
if（initialRequest.type==APIRestStatus.Complete）{
var state=initialRequest.responsePayload.order？.state为OrderState；
if（state==OrderState.InDelivery | | state==OrderState.Delivered）{
返回(
创建签名
);
}
}
};
常量更新按钮=（）=>{
if（state==OrderState.InDelivery）{
返回(
创建交付
);
}
}
控制台日志（deliveredd）；
返回(
{UpdateButton（）}
{SignatureButton（）}
);
}

我的第二页应该是这样的：

import React from "react";
import { Button, Form, Input } from "antd";


export function PageTwo(props: React.PropsWithChildren<CreateSignatureProps>) {


    const SendSignature = (values: Values) => {

        api.cargoApi
            .apiCargSignaturePost(request)
            .then((response) => history.push("/PageOne/" + orderId));
    }


    return (
        <Form onFinish={SendSignature}>
            <Form.Item>
                <Button type="primary" htmlType="submit">
                    {t("signature.create")}
                </Button>
            </Form.Item>
        </Form>
    );
}

从“React”导入React；
从“antd”导入{按钮、表单、输入}；
导出函数第二页（道具：React.PropsWithChildren）{
const SendSignature=（值：值）=>{
美国石油学会
.apiCargSignaturePost（请求）
.然后（（响应）=>history.push（“/PageOne/”+orderId））；
}
返回(
{t（“signature.create”）}
);
}

以下是您可以做的。当您从

PageTwo

重定向到

PageOne

时，传递一个状态，指示在

PageOne

中隐藏哪个按钮和显示哪个按钮

在

第二页
：

history.push({
路径名：“/PageOne/”+orderId，
状态：{hideCreateDelivery:true，showCreateSignature:true}
})

在第一页中
：

// to get the data from redirection
import { useLocation } from "react-router-dom";

// Inside PageOne
const location = useLocation();

// replace this
return (
  <div className="orderDetails">
    {location.state && location.state.hideCreateDelivery ? null: UpdateButton()}
    {location.state && location.state.showCreateSignature 
      ? SignatureButton()
      : null}
   </div>
 );

//从重定向获取数据
从“react router dom”导入{useLocation}；
//内页第一页
const location=useLocation（）；
//替换这个
返回(
{location.state&&location.state.hideCreateDelivery？null:UpdateButton（）}
{location.state&&location.state.showCreateSignature
？签名按钮（）
：null}
);

// to get the data from redirection
import { useLocation } from "react-router-dom";

// Inside PageOne
const location = useLocation();

// replace this
return (
  <div className="orderDetails">
    {location.state && location.state.hideCreateDelivery ? null: UpdateButton()}
    {location.state && location.state.showCreateSignature 
      ? SignatureButton()
      : null}
   </div>
 );