ESLint-函数react组件缺少返回类型-Typescript错误解释

Question

在定义组件名称时，我已经看到了类似问题的一些答案，但我想更多地了解ESLint背后的逻辑，在我的情况下，组件导出为默认值。

(｛children｝:AppProviderProps(=>-根据ESLint："；上缺少返回类型function.eslint@typescript-eslint/显式模块边界类型"；。有人能向我解释一下为什么我一直认为这是编写React组件的标准方法吗？在这种情况下，解决方案是什么？

import React, { ReactNode } from 'react';
import { Provider } from 'react-redux';
import store from '../../@state/createStore';

export default ({ children }: AppProviderProps) => (
<Provider store={store}>
**my code**
</Provider>
);
interface AppProviderProps {
children: ReactNode;
}

PS我知道我可以禁用这个规则，但我想知道如何写，这样ESLint就不会对我大喊大叫了。

Answer 1

规则类型脚本eslint/explicit模块边界类型告诉您，您的函数需要和显式返回类型。来源：

函数返回值和参数的显式类型使任何调用代码都能清楚地了解模块边界的输入和输出。

因此，您需要添加适当的返回类型，在您的示例中，无论<Provider />的类型是什么：

将TypeOfProviderHere替换为正确的类型。

export default ({ children }: AppProviderProps): TypeOfProviderHere => (
<Provider store={store}>
**my code**
</Provider>
);