React-Select结合Formik出现S6544 TypeScript警告如何解决？

问题原因 #

formik.setFieldValue 是一个异步函数，调用后会返回 Promise，但React-Select的onChange属性要求传入的回调函数返回值为void（即无返回值）。你之前的箭头函数采用简写形式（无大括号），相当于直接返回了setFieldValue的Promise结果，这违反了TypeScript的类型约束，触发了S6544警告。

优化方案 #

以下几种方法都可以消除警告，按需选择：

方案1：添加函数体大括号，不返回任何值

最直观的方式是给箭头函数加上大括号，让函数内部执行调用但不返回结果，默认返回undefined（符合void要求）：

<Select 
  options={publisherOptions} 
  onChange={selectedOption => {
    formik.setFieldValue("publisherId", selectedOption?.value);
  }} 
/>

方案2：使用void关键字忽略Promise返回值

如果想保持箭头函数的简写形式，可以用void关键字明确丢弃setFieldValue返回的Promise，让函数返回void：

<Select 
  options={publisherOptions} 
  onChange={selectedOption => void formik.setFieldValue("publisherId", selectedOption?.value)} 
/>

方案3：用异步函数包裹（适合需要额外异步逻辑的场景）

如果后续需要在setFieldValue执行后添加其他异步操作，可以用async函数包裹，无需显式返回任何值：

<Select 
  options={publisherOptions} 
  onChange={async (selectedOption) => {
    await formik.setFieldValue("publisherId", selectedOption?.value);
    // 可在此添加其他异步处理逻辑
  }} 
/>

内容的提问来源于stack exchange，提问作者Muflix