最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - What's the proper type declaration of React context functions to avoid linting issues? - Stack Overflow

programmeradmin0浏览0评论

I am using React Context and I have:

const DocumentContext = createContext<
    [DocumentStateType, React.Dispatch<any>, React.Dispatch<any>]
>([initVal, () => { }, () => { }]);

But my linter plains:

Unexpected empty arrow function @typescript-eslint/no-empty-function

I know I can turn that off in my linting settings, but is there a right way to do it?

I am using React Context and I have:

const DocumentContext = createContext<
    [DocumentStateType, React.Dispatch<any>, React.Dispatch<any>]
>([initVal, () => { }, () => { }]);

But my linter plains:

Unexpected empty arrow function @typescript-eslint/no-empty-function

I know I can turn that off in my linting settings, but is there a right way to do it?

Share Improve this question edited Jun 28, 2021 at 13:02 zhulien 5,7154 gold badges24 silver badges39 bronze badges asked Jun 28, 2021 at 13:01 ShamoonShamoon 43.6k101 gold badges329 silver badges628 bronze badges 1
  • () => undefined? It's the same as () => {}, but the body is not empty – Teneff Commented Jun 28, 2021 at 14:52
Add a ment  | 

3 Answers 3

Reset to default 5

If you're looking only to suppress linter message you may declare it as:

const DocumentContext = createContext<
    [DocumentStateType, React.Dispatch<any>, React.Dispatch<any>]
>([initVal, () => { /* do nothing */ }, () => { /* do nothing */ }]);

or as:

const DocumentContext = createContext<
    [DocumentStateType, React.Dispatch<any>, React.Dispatch<any>]
>([initVal, () => undefined, () => undefined]);

If you're absolutely sure you're not going to use this default value anywhere. i.e you don't have ponents using this context beyond this context's provider you may simply define it as:

const DocumentContext = createContext<
    [DocumentStateType, React.Dispatch<any>, React.Dispatch<any>]
>(null as any);

You can use the option allowArrowFunctions

Documentation

"@typescript-eslint/no-empty-function": ["error", {"allow": ["arrowFunctions"]}],

If you are using lodash you can use the noop function to bypass linting.

I assume other libraries have similar functions.

与本文相关的文章

发布评论

评论列表(0)

  1. 暂无评论