从一个自动完成中选择的选项显示在另一个自动完成中

Question

我是一个新手，我正在尝试使用react-hook-forms构建表单。 我在表单的两个不同步骤上使用了自动完成功能， 出于某种原因，我从第一个选项中选择的选项也出现在第二个“自动完成”中（没有标签）。

这是第一次自动完成的代码：

styles[]

这是第二个代码：

 <Controller
              name="Disease_IDJ"
              control={control}
              render={(props) => (
                <Autocomplete
                  multiple
                  id="diseases"
                  options={diseases}
                  // defaultValue={selectedDiseases.Disease_IDJ}
                  getOptionLabel={(disease) => disease.Disease_Name}
                  // getOptionSelected={(disease, value) => {
                  //   return disease.Disease_Name === value.Disease_Name;
                  // }}
                  style={{ width: "100%" }}
                  onChange={handleDiseasesChange}
                  renderInput={(params) => (
                    <TextField
                      {...params}
                      size="small"
                      label="Diseases"
                      variant="outlined"
                      name="Disease_IDJ"
                      inputRef={register()}
                    />
                  )}
                />
              )}
              defaultValue={[]}
            />

如果我从疾病中选择一个选项，它将出现在以下药物中：

您知道我需要更改什么吗？