我有一个组件需要在选项列表中显示姓名，但同时在表单中发送姓名ID。该怎么做？const employees: UserModel[] = [ { id: 1, firs...

我有一个组件需要在选项列表中显示名称，但同时在表单中发送名称 ID。该怎么做？

const employees: UserModel[] = [
  {
    id: 1,
    firstName: 'Hugo',
    lastName: 'Race'
  },
  {
    id: 2,
    firstName: 'Jack',
    lastName: 'Sheppard'
  },
  {
    id: 3,
    firstName: 'Kate',
    lastName: 'Ostin'
  },
];

<Box
  component="form"
  id="applicationForm"
  noValidate
>
  <Autocomplete
    options={employees}
    getOptionLabel={(option: UserModel) => (`${option.firstName} ${option.lastName}`)}
    getOptionKey={(option: UserModel) => option.id}
    id="studentId"
    isOptionEqualToValue={(option, value) => option.id === value.id}
    renderInput={(params) =>
      <TextField
        {...params}
        label="Сотрудник"
        variant="filled"
        error={errors.studentId ? true : false}
        {...register('studentId', {
          required: errorLocales.validation.requiredField,
        })}
      />}
  />
</Box>

现在，发送表单时会发送全名，但您需要发送 ID