Ошибка отключения предупреждения о перехватах / исчерпывающих задержках при использовании создателя избыточных действий внутри ловушки useEffect - PullRequest
Новая
       22

Ошибка отключения предупреждения о перехватах / исчерпывающих задержках при использовании создателя избыточных действий внутри ловушки useEffect

0 голосов
/ 28 января 2020

Попытка вызвать создатель избыточного действия в хуке useEffect следующее предупреждение - 

React Hook useEffect has a missing dependency: 'getPlanQuotes'. Either include it or remove the dependency array  react-hooks/exhaustive-deps

Это хук useEffect - 

const { getPlanQuotes } = props;

useEffect(() => {
   getPlanQuotes();
}, []);

Поэтому я попытался отключить его с помощью // eslint-disable-next-line react-hooks/exhaustive-deps. Вот так - 

useEffect(() => {
    getPlanQuotes();
    // eslint-disable-next-line react-hooks/exhaustive-deps
}, []);

Но все равно выдает предупреждение на консоль без указания react-hooks/exhaustive-deps

А также редактор выдает следующую ошибку -

.eslintr c config- 

{
    "parser": "babel-eslint",
    "extends": ["eslint:recommended", "plugin:react/recommended", "prettier"],
    "env": {
        "jest": true,
        "browser": true,
        "node": true,
        "es6": true
    },
    "plugins": ["json", "prettier"],
    "rules": {
        "prettier/prettier": ["error"],
        "no-console": "off"
    },
    "parserOptions": {
        "ecmaFeatures": {
            "jsx": true
        },
        "rules": {
            "no-underscore-dangle": [
                "error",
                {
                    "allow": ["_id", "b_codes_id"]
                }
            ],
            "react/prop-types": [1]
        },
        "settings": {
            "import/resolver": "meteor"
        },
        "globals": {
            "_": true,
            "CSSModule": true,
            "Streamy": true,
            "ReactClass": true,
            "SyntheticKeyboardEvent": true
        }
    }
}

1 Ответ

1 голос
/ 30 января 2020

Это была проблема с конфигурацией .eslintrc, как подозревал @DrewReese. В массиве plugins отсутствовал react-hooks, а в объекте rules отсутствовали react-hooks правила.

Итак, окончательная конфигурация выглядит следующим образом - 

{
    "parser": "babel-eslint",
    "extends": ["eslint:recommended", "plugin:react/recommended", "prettier"],
    "env": {
        "jest": true,
        "browser": true,
        "node": true,
        "es6": true
    },
    "plugins": ["json", "prettier", "react-hooks"], //added "react-hooks" here
    "rules": {
        "prettier/prettier": ["error"],
        "no-console": "off"
    },
    "parserOptions": {
        "ecmaFeatures": {
            "jsx": true
        },
        "rules": {
            "no-underscore-dangle": [
                "error",
                {
                    "allow": ["_id", "b_codes_id"]
                }
            ],
            "react/prop-types": [1],
            "react-hooks/rules-of-hooks": "error", // added "react-hooks/rules-of-hooks"
            "react-hooks/exhaustive-deps": "warn" // added "react-hooks/exhaustive-deps"
        },
        "settings": {
            "import/resolver": "meteor"
        },
        "globals": {
            "_": true,
            "CSSModule": true,
            "Streamy": true,
            "ReactClass": true,
            "SyntheticKeyboardEvent": true
        }
    }
}
...