Javascript React钩子窗体-控制器-React AsyncSelect-Lodash Debounce |显示加载选项失败

当我使用lodash中的

debounce

时，React hook未在加载AsyncSelect中的选项中显示选项

这是代码

const NoteFormMaster = ({ register, control, errors }) => {
  
  const getAsyncOptions = (inputText) => {
    return axios
      .get(`/v1/user?username=${inputText}`)
      .then((response) => {
        return response.data.map((user) => ({
          value: user.id,
          label: user.username,
        }));
      })
      .catch((error) => {
        alert(JSON.stringify(error));
      });
  };

  const loadOptions = (inputText) => getAsyncOptions(inputText);
  const debounceLoadOptions = _.debounce(loadOptions, 3000);

  return (
    <Controller
        control={control}
        name="shareWith"
        id="shareWith"
         as={
           <AsyncSelect
              // cacheOptions
              loadOptions={(v) => debounceLoadOptions(v)}
              defaultValue={[]}
              isMulti
              isClearable
              defaultOptions={[]}
           />
         }
      />
    )
  );
};

constnoteformmaster=（{寄存器，控件，错误}）=>{
常量getAsyncOptions=（inputText）=>{
返回轴
.get（`/v1/user？username=${inputText}`）
。然后（（响应）=>{
返回response.data.map（（用户）=>({
值：user.id，
标签：user.username，
}));
})
.catch（（错误）=>{
警报（JSON.stringify（错误））；
});
};
const loadOptions=（inputText）=>getAsyncOptions（inputText）；
const debounceloadpoptions=uu.debouncy（loadOptions，3000）；
返回(
}
/>
)
);
};

但是，当我不使用debounce时，比如

loadOptions={（v）=>getAsyncOptions（v）}

它就可以工作了。 怎么处理这个问题？

---

谢谢。

loadOptions

希望使用新选项调用回调参数或返回承诺。您的

debounceloadpoptions

返回一个包装在debouncy函数中的函数，因此它不能满足这两个要求中的任何一个

考虑到您的实现，我将像这样替换loadOptions函数声明

const loadOptions=React.useCallback(
去盎司（（输入文本，回调）=>{
getAsyncOptions（inputText）.then（（选项）=>回调（选项））；
}, 3000),
[]
);

此外，也不需要按原样声明loadOptions属性。应该注意的是，loadOptions道具实际上会传回两个参数，在这种情况下，需要第二个参数来设置新选项，以便选择可以如下呈现：

<AsyncSelect
  // cacheOptions
  loadOptions={loadOptions}
  defaultValue={[]}
  isMulti
  isClearable
  defaultOptions={[]}
/>