File Manager

Current Path: Root / node_modules/ eslint-plugin-react/ lib/ rules

Parent Directory

Name	Size	Last Modified
[F]boolean-prop-naming.js Edit	12.29 KB	2022-10-08 17:28:24
[F]button-has-type.js Edit	4.25 KB	2022-10-08 17:28:24
[F]default-props-match-prop-types.js Edit	3.32 KB	2022-10-08 17:28:24
[F]destructuring-assignment.js Edit	8.66 KB	2022-10-08 17:28:25
[F]display-name.js Edit	7.81 KB	2022-10-08 17:28:25
[F]forbid-component-props.js Edit	3.27 KB	2022-10-08 17:28:25
[F]forbid-dom-props.js Edit	3.07 KB	2022-10-08 17:28:25
[F]forbid-elements.js Edit	2.96 KB	2022-10-08 17:28:25
[F]forbid-foreign-prop-types.js Edit	3.38 KB	2022-10-08 17:28:25
[F]forbid-prop-types.js Edit	8.33 KB	2022-10-08 17:28:25
[F]function-component-definition.js Edit	8.02 KB	2022-10-08 17:28:26
[F]hook-use-state.js Edit	5.45 KB	2022-10-08 17:28:26
[F]iframe-missing-sandbox.js Edit	3.88 KB	2022-10-08 17:28:26
[F]jsx-boolean-value.js Edit	4.27 KB	2022-10-08 17:28:26
[F]jsx-child-element-spacing.js Edit	2.80 KB	2022-10-08 17:28:26
[F]jsx-closing-bracket-location.js Edit	10.58 KB	2022-10-08 17:28:26
[F]jsx-closing-tag-location.js Edit	1.92 KB	2022-10-08 17:28:26
[F]jsx-curly-brace-presence.js Edit	13.66 KB	2022-10-08 17:28:26
[F]jsx-curly-newline.js Edit	5.85 KB	2022-10-08 17:28:26
[F]jsx-curly-spacing.js Edit	14.36 KB	2022-10-08 17:28:26
[F]jsx-equals-spacing.js Edit	3.43 KB	2022-10-08 17:28:26
[F]jsx-filename-extension.js Edit	2.78 KB	2022-10-08 17:28:26
[F]jsx-first-prop-new-line.js Edit	2.28 KB	2022-10-08 17:28:27
[F]jsx-fragments.js Edit	6.77 KB	2022-10-08 17:28:27
[F]jsx-handler-names.js Edit	5.08 KB	2022-10-08 17:28:27
[F]jsx-indent-props.js Edit	6.29 KB	2022-10-08 17:28:27
[F]jsx-indent.js Edit	14.15 KB	2022-10-08 17:28:27
[F]jsx-key.js Edit	8.28 KB	2022-10-08 17:28:27
[F]jsx-max-depth.js Edit	4.07 KB	2022-10-08 17:28:27
[F]jsx-max-props-per-line.js Edit	4.04 KB	2022-10-08 17:28:27
[F]jsx-newline.js Edit	4.39 KB	2022-10-08 17:28:27
[F]jsx-no-bind.js Edit	5.86 KB	2022-10-08 17:28:27
[F]jsx-no-comment-textnodes.js Edit	1.64 KB	2022-10-08 17:28:27
[F]jsx-no-constructed-context-values.js Edit	7.04 KB	2022-10-08 17:28:27
[F]jsx-no-duplicate-props.js Edit	1.63 KB	2022-10-08 17:28:27
[F]jsx-no-leaked-render.js Edit	5.08 KB	2022-10-08 17:28:27
[F]jsx-no-literals.js Edit	5.60 KB	2022-10-08 17:28:27
[F]jsx-no-script-url.js Edit	2.65 KB	2022-10-08 17:28:28
[F]jsx-no-target-blank.js Edit	9.61 KB	2022-10-08 17:28:28
[F]jsx-no-undef.js Edit	2.97 KB	2022-10-08 17:28:28
[F]jsx-no-useless-fragment.js Edit	6.62 KB	2022-10-08 17:28:28
[F]jsx-one-expression-per-line.js Edit	7.37 KB	2022-10-08 17:28:28
[F]jsx-pascal-case.js Edit	4.44 KB	2022-10-08 17:28:28
[F]jsx-props-no-multi-spaces.js Edit	3.54 KB	2022-10-08 17:28:28
[F]jsx-props-no-spreading.js Edit	3.94 KB	2022-10-08 17:28:28
[F]jsx-sort-default-props.js Edit	4.88 KB	2022-10-08 17:28:28
[F]jsx-sort-props.js Edit	17.60 KB	2022-10-08 17:28:28
[F]jsx-space-before-closing.js Edit	2.79 KB	2022-10-08 17:28:28
[F]jsx-tag-spacing.js Edit	10.24 KB	2022-10-08 17:28:28
[F]jsx-uses-react.js Edit	1.33 KB	2022-10-08 17:28:28
[F]jsx-uses-vars.js Edit	1.49 KB	2022-10-08 17:28:28
[F]jsx-wrap-multilines.js Edit	7.62 KB	2022-10-08 17:28:28
[F]no-access-state-in-setstate.js Edit	5.73 KB	2022-10-08 17:28:29
[F]no-adjacent-inline-elements.js Edit	2.93 KB	2022-10-08 17:28:29
[F]no-array-index-key.js Edit	7.20 KB	2022-10-08 17:28:29
[F]no-arrow-function-lifecycle.js Edit	4.59 KB	2022-10-08 17:28:29
[F]no-children-prop.js Edit	3.67 KB	2022-10-08 17:28:29
[F]no-danger-with-children.js Edit	4.99 KB	2022-10-08 17:28:29
[F]no-danger.js Edit	1.92 KB	2022-10-08 17:28:29
[F]no-deprecated.js Edit	8.20 KB	2022-10-08 17:28:29
[F]no-did-mount-set-state.js Edit	260 bytes	2022-10-08 17:28:29
[F]no-did-update-set-state.js Edit	262 bytes	2022-10-08 17:28:29
[F]no-direct-mutation-state.js Edit	4.40 KB	2022-10-08 17:28:30
[F]no-find-dom-node.js Edit	1.20 KB	2022-10-08 17:28:30
[F]no-invalid-html-attribute.js Edit	14.28 KB	2022-10-08 17:28:30
[F]no-is-mounted.js Edit	1.31 KB	2022-10-08 17:28:30
[F]no-multi-comp.js Edit	1.97 KB	2022-10-08 17:28:30
[F]no-namespace.js Edit	1.66 KB	2022-10-08 17:28:30
[F]no-redundant-should-component-update.js Edit	2.33 KB	2022-10-08 17:28:30
[F]no-render-return-value.js Edit	2.17 KB	2022-10-08 17:28:30
[F]no-set-state.js Edit	2.27 KB	2022-10-08 17:28:30
[F]no-string-refs.js Edit	3.42 KB	2022-10-08 17:28:30
[F]no-this-in-sfc.js Edit	1.24 KB	2022-10-08 17:28:30
[F]no-typos.js Edit	8.63 KB	2022-10-08 17:28:30
[F]no-unescaped-entities.js Edit	3.70 KB	2022-10-08 17:28:30
[F]no-unknown-property.js Edit	25.22 KB	2022-10-08 17:28:30
[F]no-unsafe.js Edit	4.11 KB	2022-10-08 17:28:30
[F]no-unstable-nested-components.js Edit	14.78 KB	2022-10-08 17:28:30
[F]no-unused-class-component-methods.js Edit	6.55 KB	2022-10-08 17:28:30
[F]no-unused-prop-types.js Edit	4.85 KB	2022-10-08 17:28:30
[F]no-unused-state.js Edit	15.45 KB	2022-10-08 17:28:30
[F]no-will-update-set-state.js Edit	393 bytes	2022-10-08 17:28:31
[F]prefer-es6-class.js Edit	1.49 KB	2022-10-08 17:28:31
[F]prefer-exact-props.js Edit	4.85 KB	2022-10-08 17:28:31
[F]prefer-read-only-props.js Edit	2.22 KB	2022-10-08 17:28:31
[F]prefer-stateless-function.js Edit	12.52 KB	2022-10-08 17:28:31
[F]prop-types.js Edit	6.07 KB	2022-10-08 17:28:31
[F]react-in-jsx-scope.js Edit	1.30 KB	2022-10-08 17:28:31
[F]require-default-props.js Edit	6.48 KB	2022-10-08 17:28:31
[F]require-optimization.js Edit	6.75 KB	2022-10-08 17:28:31
[F]require-render-return.js Edit	3.07 KB	2022-10-08 17:28:31
[F]self-closing-comp.js Edit	2.89 KB	2022-10-08 17:28:31
[F]sort-comp.js Edit	13.22 KB	2022-10-08 17:28:31
[F]sort-prop-types.js Edit	7.78 KB	2022-10-08 17:28:31
[F]state-in-constructor.js Edit	1.81 KB	2022-10-08 17:28:31
[F]static-property-placement.js Edit	6.24 KB	2022-10-08 17:28:31
[F]style-prop-object.js Edit	3.83 KB	2022-10-08 17:28:31
[F]void-dom-elements-no-children.js Edit	3.93 KB	2022-10-08 17:28:31

Editing: destructuring-assignment.js

/**
 * @fileoverview Enforce consistent usage of destructuring assignment of props, state, and context.
 */

'use strict';

const Components = require('../util/Components');
const docsUrl = require('../util/docsUrl');
const isAssignmentLHS = require('../util/ast').isAssignmentLHS;
const report = require('../util/report');

const DEFAULT_OPTION = 'always';

function createSFCParams() {
  const queue = [];

return {
    push(params) {
      queue.unshift(params);
    },
    pop() {
      queue.shift();
    },
    propsName() {
      const found = queue.find((params) => {
        const props = params[0];
        return props && !props.destructuring && props.name;
      });
      return found && found[0] && found[0].name;
    },
    contextName() {
      const found = queue.find((params) => {
        const context = params[1];
        return context && !context.destructuring && context.name;
      });
      return found && found[1] && found[1].name;
    },
  };
}

function evalParams(params) {
  return params.map((param) => ({
    destructuring: param.type === 'ObjectPattern',
    name: param.type === 'Identifier' && param.name,
  }));
}

const messages = {
  noDestructPropsInSFCArg: 'Must never use destructuring props assignment in SFC argument',
  noDestructContextInSFCArg: 'Must never use destructuring context assignment in SFC argument',
  noDestructAssignment: 'Must never use destructuring {{type}} assignment',
  useDestructAssignment: 'Must use destructuring {{type}} assignment',
  destructureInSignature: 'Must destructure props in the function signature.',
};

module.exports = {
  meta: {
    docs: {
      description: 'Enforce consistent usage of destructuring assignment of props, state, and context',
      category: 'Stylistic Issues',
      recommended: false,
      url: docsUrl('destructuring-assignment'),
    },
    fixable: 'code',
    messages,

schema: [{
      type: 'string',
      enum: [
        'always',
        'never',
      ],
    }, {
      type: 'object',
      properties: {
        ignoreClassFields: {
          type: 'boolean',
        },
        destructureInSignature: {
          type: 'string',
          enum: [
            'always',
            'ignore',
          ],
        },
      },
      additionalProperties: false,
    }],
  },

create: Components.detect((context, components, utils) => {
    const configuration = context.options[0] || DEFAULT_OPTION;
    const ignoreClassFields = (context.options[1] && (context.options[1].ignoreClassFields === true)) || false;
    const destructureInSignature = (context.options[1] && context.options[1].destructureInSignature) || 'ignore';
    const sfcParams = createSFCParams();

/**
     * @param {ASTNode} node We expect either an ArrowFunctionExpression,
     *   FunctionDeclaration, or FunctionExpression
     */
    function handleStatelessComponent(node) {
      const params = evalParams(node.params);

const SFCComponent = components.get(context.getScope(node).block);
      if (!SFCComponent) {
        return;
      }
      sfcParams.push(params);

if (params[0] && params[0].destructuring && components.get(node) && configuration === 'never') {
        report(context, messages.noDestructPropsInSFCArg, 'noDestructPropsInSFCArg', {
          node,
        });
      } else if (params[1] && params[1].destructuring && components.get(node) && configuration === 'never') {
        report(context, messages.noDestructContextInSFCArg, 'noDestructContextInSFCArg', {
          node,
        });
      }
    }

function handleStatelessComponentExit(node) {
      const SFCComponent = components.get(context.getScope(node).block);
      if (SFCComponent) {
        sfcParams.pop();
      }
    }

function handleClassUsage(node) {
      // this.props.Aprop || this.context.aProp || this.state.aState
      const isPropUsed = (
        node.object.type === 'MemberExpression' && node.object.object.type === 'ThisExpression'
        && (node.object.property.name === 'props' || node.object.property.name === 'context' || node.object.property.name === 'state')
        && !isAssignmentLHS(node)
      );

if (
        isPropUsed && configuration === 'always'
        && !(ignoreClassFields && isInClassProperty(node))
      ) {
        report(context, messages.useDestructAssignment, 'useDestructAssignment', {
          node,
          data: {
            type: node.object.property.name,
          },
        });
      }
    }

return {

FunctionDeclaration: handleStatelessComponent,

ArrowFunctionExpression: handleStatelessComponent,

FunctionExpression: handleStatelessComponent,

'FunctionDeclaration:exit': handleStatelessComponentExit,

'ArrowFunctionExpression:exit': handleStatelessComponentExit,

'FunctionExpression:exit': handleStatelessComponentExit,

MemberExpression(node) {
        let scope = context.getScope(node);
        let SFCComponent = components.get(scope.block);
        while (!SFCComponent && scope.upper && scope.upper !== scope) {
          SFCComponent = components.get(scope.upper.block);
          scope = scope.upper;
        }
        if (SFCComponent) {
          handleSFCUsage(node);
        }

const classComponent = utils.getParentComponent(node);
        if (classComponent) {
          handleClassUsage(node);
        }
      },

VariableDeclarator(node) {
        const classComponent = utils.getParentComponent(node);
        const SFCComponent = components.get(context.getScope(node).block);

const destructuring = (node.init && node.id && node.id.type === 'ObjectPattern');
        // let {foo} = props;
        const destructuringSFC = destructuring && (node.init.name === 'props' || node.init.name === 'context');
        // let {foo} = this.props;
        const destructuringClass = destructuring && node.init.object && node.init.object.type === 'ThisExpression' && (
          node.init.property.name === 'props' || node.init.property.name === 'context' || node.init.property.name === 'state'
        );

if (SFCComponent && destructuringSFC && configuration === 'never') {
          report(context, messages.noDestructAssignment, 'noDestructAssignment', {
            node,
            data: {
              type: node.init.name,
            },
          });
        }

if (
          classComponent && destructuringClass && configuration === 'never'
          && !(ignoreClassFields && (node.parent.type === 'ClassProperty' || node.parent.type === 'PropertyDefinition'))
        ) {
          report(context, messages.noDestructAssignment, 'noDestructAssignment', {
            node,
            data: {
              type: node.init.property.name,
            },
          });
        }

if (
          SFCComponent
          && destructuringSFC
          && configuration === 'always'
          && destructureInSignature === 'always'
          && node.init.name === 'props'
        ) {
          const scopeSetProps = context.getScope().set.get('props');
          const propsRefs = scopeSetProps && scopeSetProps.references;
          if (!propsRefs) {
            return;
          }
          // Skip if props is used elsewhere
          if (propsRefs.length > 1) {
            return;
          }
          report(context, messages.destructureInSignature, 'destructureInSignature', {
            node,
            fix(fixer) {
              const param = SFCComponent.node.params[0];
              if (!param) {
                return;
              }
              const replaceRange = [
                param.range[0],
                param.typeAnnotation ? param.typeAnnotation.range[0] : param.range[1],
              ];
              return [
                fixer.replaceTextRange(replaceRange, context.getSourceCode().getText(node.id)),
                fixer.remove(node.parent),
              ];
            },
          });
        }
      },
    };
  }),
};

Cancel

File Explorer

Navigation

File Manager

Editing: destructuring-assignment.js

File Explorer

Navigation

File Manager

Editing: destructuring-assignment.js

Confirm Deletion

Rename Item

Change Permissions (Chmod)