是否有用于以简写方式应用JSX属性的Babel变换器？

Question

在我的代码，我有很多组件，它看起来像

function AddressInput(props) { 
const { error, value, onChange, hints } = props; 
return (
    <CustomInput error={error} onChange={onChange} value={value} hints={hints} /> 
); 
} 

我不想使用<CustomInput ...props>符号，因为第一种变体允许筛选广泛使用的组件道具。 我想要什么，这是通过组件的道具在较短的方式，也许像：

const { error, value, onChange, hints } = props; 
<CustomInput :error :onChange :value :hints /> 

有什么通天的变压器，可以提供这样的能力吗？

Answer 1

不需要额外的babel插件。您可以使用速记属性名称+传播运算符。

例子：

function AddressInput(props) { 
    const { error, value, onChange, hints } = props; 
    return (<CustomInput {...{error, value, onChange, hints}} />); 
} 

不是最简洁的语法，但它可能会在将来得到改善。请参阅GitHub discussion thread。