Migrate {..this.props}, but exclude some of them

Question

Is it possible to pass the details to the child component, where { ..this.props } used for a cleaner syntax, however, to exclude certain details, for example className or id ?

Answer 1

If you don't mind using a third-party library, you can also use the lodash omit function:

  { ..._.omit(this.props, ['className', 'id']) } 

The main advantage: unlike the madox2 proposal, you do not pollute the scope with arbitrary variable names in order to avoid passing certain details to the child components. And also, while writing this answer, you are not dealing with the experimental features of ES.next.

Answer 2

You can use destructuring to accomplish this task:

 const { className, id, ...newProps } = this.props; // eslint-disable-line // `newProps` variable does not contain `className` and `id` properties 

Since this syntax is currently an ECMAScript (Rest / Spread Properties) clause, you will need to re-code the code to enable this function (for example, using babel).