转移{..this.props}但排除某些

Question

是否可以将道具向下转移到使用{ ..this.props }的子组件，以便更简洁的语法，但是排除某些道具，例如className或id？

Answer 1

您可以使用解构来完成这项工作：

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

由于此语法目前是ECMAScript提案（Rest / Spread Properties），因此您需要转换代码才能启用此功能（例如使用babel）。

Answer 2

如果您不介意使用第三方库，您还可以使用lodash的omit功能：

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

主要优点：与madox2的建议不同，您不会使用任意变量名来污染您的范围，只是为了避免将某些道具传递给子组件。此外，在撰写本答案时，您还没有处理实验性ES.next功能。