小编Dar*_*rge的帖子

我正在设置一个多步骤表单来处理使用 Next.js 和 Material-UI 的登录。在signup.js位于 的页面中pages/signup.js。我的多步骤表单已创建。在该页面中，定义了作为步骤内容显示的子组件getStepContent(step)，并在其下面调用主组件SignInSide。页面上还定义了前进和后退的步骤signup.js。子表单组件仅包含输入。我试图将输入到子组件表单输入中的数据传递到注册页面中父组件的状态，signup.js以便我可以提交它。父组件和子组件都是使用 React hooks 进行状态的功能组件。

我已经尝试将 props 从父组件传递到子组件，然后将 TextField 组件的“值”定义为 {props.value}，当我使用父组件中的 console.log 值对其进行测试时，该方法有效我看到了字母，但是没有 name: 附加到它，它只是作为字母出现，所以我尝试添加 [name]: event.target.value 但当我尝试在输入中写入文本时字段它只是说 [Object object] 但是，在控制台中我可以看到 [Object object]（在此处插入键入的字母），因此它记录了文本，但不正确，并且键入的文本在输入框中不可见。

这就是步骤内容所在的位置。

const steps = ['Welcome', 'Information', 'Creative', 'Confirm'];

function getStepContent(step) {
  const [value, setValue] = React.useState('');

  //set state for returned input values
  function handleChange(newValue) {
    setValue(newValue);
  }

  switch (step) {
    case 0:
      return (
        <div style={{ padding: '8em 0 4em' }}> …