问题描述
我试图使“打开聊天”按钮显示一个绝对定位的div，然后再次单击将其折叠。
我尝试使用组件react-collapse，但是当div的内容定位为绝对时它不起作用，尽管当定位为静态/相对时它却起作用。第一次单击将显示内容，但是第二次单击将不会隐藏它。为什么会这样？ 有人知道该怎么做吗？
我希望显示绝对内容的原因是，这样我就可以将聊天框覆盖在其他内容之上，如图所示。谢谢！
解决方法
您无需使用react-collapse就可以实现此目的，只需使用状态变量作为组件的条件即可，例如isVisisble。您需要将状态变量从导航栏传递到ChatComponent。然后在OpenChat上单击切换isVisisble
<ChatComponent style={{...ur other styles,display : props.isVisisble ? 'block':'none'}} />