解构属性 其名称为保留关键字

Question

在使用 material ui 时，我意识到他们在转换组件中有一个名为 in 的道具，但是当我试图破坏道具时，我不能因为 in 是保留关键字。

const MyFade = ({ children, in, ...otherProps }) => { // this gives me an error 
  return (
    <div {...otherProps}>
      <Fade in={in}>{children}</Fade>
    </div>
  );
};

我该怎么做？我需要破坏 in 并让 otherProps 传播到 div。

Answer 1

只需在解构中分配一个新的非保留名称即可。

const o = {
   in: 'foo',
   out: 'boo',
};

const { in: inProp } = o;
      // ^^^^ assign new name

console.log(inProp);