How to fix Eslint error "prefer-destructuring"?

javascript ecmascript-6 eslint
Timo picture Timo · Nov 20, 2017 · Viewed 37.4k times · Source

I wanted to shorten an object literal in ES6 like this:

const loc = this.props.local;

The reason is loc.foo(); is a lot easier to type than this.props.local.foo();

But now ESLint complains:

Use object destructuring: prefer-destructuring

I've read the error description on eslint.org but I don't understand it. They have an example which looks very similar to my code but theirs seem to be ok?

var foo = object.bar;

How can I fix the error without setting it to ignore in the .eslintrc file?

Answer

Badis Merabet picture Badis Merabet · Nov 20, 2017

change your code from:

const local = this.props.local;

to: 

const { local } = this.props;

They are equivalent and you can call local.foo() in the same way. except that the second use object destructuring.

Related questions

eslint: error Parsing error: The keyword 'const' is reserved

I am getting this error from ESLint: error Parsing error: The keyword 'const' is reserved from this code: const express = require('express'); const app = express(); const _ = require('underscore'); I've tried removing node_modules and reinstalling all npm packages (as suggested …

Read More
Expected 'this' to be used by class method

In my class, eslint is complaining "Expected 'this' to be used by class method 'getUrlParams' Here is my class: class PostSearch extends React.Component { constructor(props) { super(props); this.getSearchResults(); } getUrlParams(queryString) { const hashes = queryString.slice(queryString.indexOf('?') + 1).…

Read More
How do I access the Object.prototype method in the following logic?

I am using the following logic to get the i18n string of the given key. export function i18n(key) { if (entries.hasOwnProperty(key)) { return entries[key]; } else if (typeof (Canadarm) !== 'undefined') { try { throw Error(); } catch (e) { Canadarm.error(…

Read More