React JSX 选择性地将属性传递给组件

Question

这段代码有效，但我不禁认为有更好的方法。我无法将 expanded 设置为 false，因为当我这样做时组件会中断（就像他们在Set JSX attribute based on another JSX attribute react中所做的那样）另外，我需要添加更多条件分支，这意味着代码重复if (itemProps.Expanded == true) {  return (    <Accordion expanded={true}>    ...    </Accordion >  )}else {  return (    <Accordion>    ...    </ Accordion>  )}有什么建议么？

Answer 1

您可以动态创建 props 对象并使用 ...(spread) 传递道具

const props = itemProps.Expanded == true ? { expanded: true } : {};

return <Accordion {...props}>...</Accordion>;

Answer 2

对不起，伙计们试过了，它奏效了。感谢您的时间

let expanded = undefined;

if (itemProps.Expanded) {

  expanded = true;

}

return (

    <Accordion expanded={expanded}>

    ...

    </Accordion >

)

```