仅当 react.js 中的条件为真时才发送道具

Question

我在某个项目中使用 React.js 并且我只想在条件为真时发送一个道具，我不想要的是发送空值或空的东西，如下例（或这个问题）：

return (
    <SomeComponent
        prop1={foo === true ? "value" : null}
    />
);

如果条件为真，我想发送整个道具（不仅仅是它的值），如下所示：

render: function(){

    ...

    return (
        <SomeComponent
           {if(foo === true) prop1="value"}
        />
    );
}

我也试过

    ...

    var prop1;
    if(foo === true) prop1 = "prop1='value'";

    return <SomeComponent {prop1} />;

当然像

    ...

    return (
        </SomeComponent
            {foo === true ? prop1="value" : ""}
        />
    );

在所有情况下Unexpected token，我都遇到了错误，我一直在搜索，但没有找到任何东西，有什么办法可以做到这一点吗？

谢谢。

Answer 1

虽然不确定目的是什么 - 使用 ES6 扩展运算符，您可以这样做：

const props = {};

if (foo === true) { // or just if (foo) {
   props.prop1 = 'value';
}

<SomeComponent
   { ...props } />