反应 - 2 个可折叠标签之间的空格

Question

我的代码中有 2 个彼此相邻的可折叠标签：

<Collapsible trigger="text 1 " >
//some html content here
</Collapsible> 
<Collapsible trigger="text 2 " >
//some other html content here
</Collapsible> 

单击此处查看问题图像 但是，当我关闭与"文本 1"关联的可折叠对象时，"文本 1"和下一个可折叠元素之间仍然存在一个空格。理想情况下，我想要一个滑动效果，以便当我关闭第一个可折叠对象时，第二个可折叠对象的内容会自动向上移动，随后在打开第一个可折叠对象时向下移动。

Answer 1

尝试从

//some html content here

成为类似的东西

{this.state.isExpanded && (/* some html content here */)

如果您的isExpanded状态为false，this.props.children将不会呈现(因此不再保留空间(

请参阅此示例代码

编辑：对不起我之前的回答，渲染任何东西，你需要返回null