Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

eslint object-shorthand error with variable passed in

I have the following function that is setting up a select2 plugin, which needs selects to stay open if they are multiple but closed if they are not:

function setUpSelects($selects, closeOnSelect) {
  $selects.each((i, item) => {
    const $item = $(item);

    $item.select2({
      closeOnSelect: closeOnSelect,  // <-- error on this line
      minimumResultsForSearch: Infinity,
      placeholder: $item.data('placeholder') || $item.attr('placeholder'),
    });
  });
}

setUpSelects($('select:not([multiple])'), false);
setUpSelects($('select[multiple]'), true);

However, when I try to run this code, the eslint checker is giving me an error (on the line shown above) of:

error Expected property shorthand object-shorthand

I have done a search and read the docs but it doesn't show how you are meant to use a variable and the unaccepted answer on this question seems to think it may be a bug in eslint (although I have found no evidence to support that)

Is there a way to make this work or should I just disable the rule for that line?

like image 592
Pete Avatar asked Dec 04 '17 14:12

Pete


People also ask

What is object property shorthand?

Object property shorthand enables us to simply pass in the name of the key as opposed to repeating the name and the key.

What is object literal shorthand?

JavaScript Object Literal Shorthand Syntax is a feature that provides a path to cleanerJavaScript. Not only does it provide a way to reduce the size of your code, but it will be easier to read and understand.

What is shorthand property in JavaScript?

With Shorthand Properties, whenever you have a variable which is the same name as a property on an object, when constructing the object, you can omit the property name. What that means is that code that used to look like this, function formatMessage (name, id, avatar) { return {


2 Answers

An excerpt from eslint regarding the issue:

Require Object Literal Shorthand Syntax (object-shorthand) - Rule Details

This rule enforces the use of the shorthand syntax. This applies to all methods (including generators) defined in object literals and any properties defined where the key name matches name of the assigned variable.

Change

closeOnSelect: closeOnSelect

to just

closeOnSelect
like image 108
Carl Edwards Avatar answered Sep 27 '22 21:09

Carl Edwards


This rule checks that object literal shorthand syntax is used, e.g {a, b} instead of {a: a, b: b}. The rule is configurable, see options for more details.

Despite this shorthand syntax is convenient, in some cases you may not want to force it usage. You can disable the check in your config:

// .eslintrc.json

{
  "rules": {
    // Disables the rule. You can just remove it,
    // if it is not enabled by a parent config.
    "object-shorthand": 0
  }
}

In case of TSLint there is a different option:

// tslint.json

{
  "rules": {
    // Disables the rule. You can just remove it,
    // if it is not enabled by a parent config.
    "object-literal-shorthand": false
  }
}
like image 37
Valeriy Katkov Avatar answered Sep 24 '22 21:09

Valeriy Katkov