Question

我使用的是：https://react-materialize.github.io/#/collapsible。

有没有办法以编程方式制作一个反应物化手风琴而不是点击它本身？

我正在尝试添加一个onClick处理程序，以便在选择一个react-materialize可折叠手风琴时我可以执行一个setState，这样我就可以根据该状态执行某些操作并将内容呈现到该手风琴弹出窗口中（条件渲染和其他目的。

我有3个CollapsibleItems，当页面呈现时，this.changeBoardType被调用6次，如果我在其中执行setState，我会陷入无限循环：

超出最大更新深度。组件时可能会发生这种情况反复调用componentWillUpdate中的setState或 componentDidUpdate。 React限制嵌套更新的数量防止无限循环。

注意：如果我在<CollapsibleItem onSelect={this.changeBoardType("single")} />

上使用内置的onSelect道具，会发生同样的事情

<Collapsible accordion>
   <CollapsibleItem onClick={this.changeBoardType("single")} header='Single Hand' icon='filter_1'>
       <Row>
           <Input s={12}
               name="singleHand"
               type="select"
               label="Position"
               value={this.state.singleHand}
               onChange={this.handleChange}>
                              ...

Answer 1

如果您尝试将参数传递给onClick或onSelect等事件处理程序，则需要执行以下操作：

<CollapsibleItem onClick={() => this.changeBoardType('single')} ...>

调用一个返回changeBoardType函数的匿名函数将阻止无限setState循环

可折叠手风琴onClick和开放处理程序

1 个答案: