如何将更新的值传递到新的单独组件中？答案

【问题标题】：How do I pass in an updated value into a new separate component?如何将更新的值传递到新的单独组件中？
【发布时间】：2021-08-11 15:10:16
【问题描述】：

在部门选择字段中选择“开发”后，我希望更新后的值传递到新组件“扩展开发”中。

这是一个填充部门字段的列表

export const getDepartmentCollection = ()=>([
    { id: '1', title: 'Development' },
    { id: '2', title: 'Marketing' },
    { id: '3', title: 'Accounting' },
    { id: '4', title: 'HR' },
])

这是用户可以从部门下拉菜单中选择的地方。

<Controls.Select
    name="departmentId"
    label="Department"
    value={values.departmentId}
    onChange={handleInputChange}
    options={employeeService.getDepartmentCollection()}
    error={errors.departmentId}
/>

一旦用户做出选择，我想在这里将新值传递给这个新组件。

  const ExpandDevelopment = (fieldValue = values) => {
    if (fieldValue.departmentId === "Development") {
        return (
          <Controls.Input
            label="Developer Position"
            name="developerPosition"
            value={values.developerPosition}
          />
        );
      } else {
        return null;
    }
  };

但是，fieldValue.departmentID 呈现为未定义。

如果您想深入了解此代码的工作原理 (/page/Employees/EmployeeForm) - CodeSandBox：https://codesandbox.io/s/intelligent-river-9diyw

【问题讨论】：

标签： reactjs function react-hooks components undefined

【解决方案1】：

查看了您的代码并进行了一些更改。您可能需要对验证代码进行一些调整。

Updated Sandbox

【讨论】：

如果答案有效，您能否接受并投票赞成：-)
刚刚做了。因为我是新手，所以我还不能投票。