How to fix "Expected to return a value at the end of arrow function." error?-CodePudding

Eslint is giving me the Expected to return a value at the end of arrow function error. How do I fix this?

useEffect(() => {
    if (show && inView) {
        const timer = () => {
            setCount(count   1);
        };
        if (count >= number) {
            const plus = setPlus(' ');
            return plus;
        }
        const interval = setInterval(timer, 800 / number);
        return () => clearInterval(interval);
    }
    setCount(1);
    setPlus('');
    setShow(false);
}, [count, inView, number, plus, show]);

CodePudding user response：

do you use some react extensions for eslint in your project ?

Here's a standard eslint config for react projects:

module.exports = {
  env: {
    browser: true,
    es2021: true,
  },
  extends: [
    'plugin:react/recommended',
    'airbnb',
  ],
  parserOptions: {
    ecmaFeatures: {
      jsx: true,
    },
    ecmaVersion: 12,
    sourceType: 'module',
  },
  plugins: [
    'react',
    'prefer-arrow',
  ],
}

Try it in your .eslintrc and tell me if you still got this error

EDIT:

Can you join your eslint config file ? You shouldn't get this error. Maybe I can explain you some stuff about it. Or your can just disable this rule for your project by editing your .eslintrc file and adding:

rules: {
    'consistent-return': 'off',
}

CodePudding user response：

This is my .eslintrc

{
"env": {
    "browser": true,
    "es2021": true
},
"extends": [
    "react-app",
    "plugin:react/recommended",
    "airbnb",
    "plugin:prettier/recommended"
],
"parserOptions": {
    "ecmaFeatures": {
        "jsx": true
    },
    "ecmaVersion": "latest",
    "sourceType": "module"
},
"plugins": ["react", "prettier"],
"rules": {
    "react/jsx-uses-react": ["off"],
    "react/react-in-jsx-scope": ["off"],
    "react/jsx-props-no-spreading": ["warn"],
    "no-shadow": "off"
}

}