移至下一步或在步进材质UI中未存储数据

Question

当移至下一步或在步进材质UI中返回时，数据未存储。 在getStepContent（）函数中，我将返回一个，两个等不同的组件，并且所有组件都具有材料表和文本字段。

但是当我单击下一步或返回时，数据消失了。

请参见示例代码：

function getSteps() {
    return [
      "One",
      "Two", 
       "Three",

      
      "Additional Detail",
    ];
  }

  function getStepContent(step) {
    switch (step) {
      case 0:
      return <One />;

      case 1:
        return <Two />;

      case 2:
       return <Three />;

   
      default:
        return "No data available";
    }
  }


  const [activeStep, setActiveStep] = React.useState(0);
  const steps = getSteps();


  return (
  
      <div >
        <Grid container spacing={2}>
          <Grid item xs={12}>
            <div>
              <Paper container className={classes.header}>
                <Stepper
                  style={{
                    background: "transparent",
                    maxWidth: "2000",
                    overflow: "auto",
                  }}
                  alternativeLabel
                  activeStep={activeStep}
                  connector={<QontoConnector />}
                >
                  {steps.map((label, index) => {
                    const stepProps = {index};
                    const buttonProps = {};

                    if (isStepSkipped(index)) {
                      stepProps.completed = false;
                    }
                    return (
                      <Step key={label} {...stepProps}>
                        <StepLabel
                          onClick={handleStep(index)}
                          {...buttonProps}
                          StepIconComponent={QontoStepIcon}
                        >
                          {label}
                        </StepLabel>
                      </Step>
                    );
                  })}
                </Stepper>