我正在使用API调用填充编辑表单，该API调用以以下格式返回值：

{
    "id": 1,
    "name": "location1",
    "description": "Heating Plate",
    "isArchived": 0,
    "departmentOther": {
        "id": 18,
        "name": "Tools",
        "description": "Tools Department",
        "isArchived": 0,
        "version": 1,
    }
}

下面是我的API调用：

React.useEffect(() => {
  const fetchData = async () => {
    const res = await axios.get(`${editUrl + (selectedRecord.id)}`);
    setValues( res.data );
  };
  fetchData();
}, [setValues]);

我在调用departmentOther数据元素内部的值时遇到问题。
在我的编辑页面中，我尝试调用Id来匹配下拉列表中的值，如下所示：

const [values, setValues] = React.useState({} as any);

     <Dropdown
            onChange={handleInputChange}
            label='Department'
            name='departmentName'
            value={values.departmentOther.id}
            prompt='Select A Department...'
      />

下拉组件

export default function Dropdown(props) {
  const { error = null, label, onChange, prompt, value, url, ...other } = props;
  const [options, setOptions] = React.useState([]);

  return(
    <FormControl >
        <InputLabel>{label}</InputLabel>
        <Select
                defaultValue=''
                onChange={onChange}
                value={(value === undefined || value === null || options.length === 0) ? '' : value} 
                {...other}
                {...(error && {error: true, helperText: error})}
            >
            <MenuItem>{prompt}</MenuItem>
            {options.map((option, id) => (
                <MenuItem
                    key={option.id}
                    value={option.id}
                >
                    {option.name}
                </MenuItem>
            ))}
        </Select>
    </FormControl>

    );
}

但我最终得到一个控制台错误，内容如下：
未捕获的类型错误：无法读取未定义的属性（阅读“id”）
控制台错误导致表单失败且无法加载，这意味着我的值为空。如何在这种格式中调用一个值？
我还尝试了所有这些调用值的方法：

value={values.departmentOther?.id}
    value={values.departmentOther[0].id}
    value={values['departmentOther']['id']}
    value={values['departmentOther'][0]['id']}

唯一一个没有给予我类似的控制台错误的是value={values.departmentOther?.id}，但是当我从下拉列表中选择一个选项时，它不是更新departmentOther Id，而是将值放入一个名为undefined的新数据元素中。就像这样：

{
    "id": 1,
    "name": "location1",
    "description": "Heating Plate",
    "isArchived": 0,
    "departmentOther": {
        "id": 18,
        "name": "Tools",
        "description": "Tools Department",
        "isArchived": 0,
        "version": 1,
    },
    "undefined": 22
}

如果我使用相同的下拉菜单来更新一个没有嵌套的数据元素，它工作得很好，所以我知道下拉菜单功能正常，这只是访问departmentOther对象内部的值的问题。上面的values变量还用于保存表单的所有值，该表单具有多个文本字段。不使用嵌套值的所有内容都完全按照预期工作，没有任何错误。
有人能告诉我如何访问这个值，以便我能够更新它吗？到目前为止没有任何工作。