mirror of
https://github.com/element-hq/element-web
synced 2024-11-24 18:25:49 +03:00
Move rendering of PersistedElements into other lifecycle stages
For https://github.com/vector-im/riot-web/issues/12877 Original error: ``` Warning: Render methods should be a pure function of props and state; triggering nested component updates from render is not allowed. If necessary, trigger nested updates in componentDidUpdate. Check the render method of PersistedElement. in PersistedElement (created by AppTile) in div (created by AppTile) in div (created by AppTile) in AppTile (created by AppsDrawer) in div (created by AppsDrawer) in div (created by AppsDrawer) in AppsDrawer (created by AuxPanel) in div (created by AutoHideScrollbar) in AutoHideScrollbar (created by AuxPanel) in AuxPanel (created by RoomView) in div (created by RoomView) in div (created by MainSplit) in MainSplit (created by RoomView) in ErrorBoundary (created by RoomView) in main (created by RoomView) in RoomView (created by LoggedInView) in div (created by LoggedInView) in DragDropContext (created by LoggedInView) in div (created by LoggedInView) in LoggedInView (created by MatrixChat) in ErrorBoundary (created by MatrixChat) in MatrixChat ```
This commit is contained in:
parent
05b58dc81d
commit
0bb8973ee6
1 changed files with 10 additions and 6 deletions
|
@ -113,10 +113,12 @@ export default class PersistedElement extends React.Component {
|
|||
|
||||
componentDidMount() {
|
||||
this.updateChild();
|
||||
this.renderApp();
|
||||
}
|
||||
|
||||
componentDidUpdate() {
|
||||
this.updateChild();
|
||||
this.renderApp();
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
|
@ -141,6 +143,14 @@ export default class PersistedElement extends React.Component {
|
|||
this.updateChildVisibility(this.child, true);
|
||||
}
|
||||
|
||||
renderApp() {
|
||||
const content = <div ref={this.collectChild} style={this.props.style}>
|
||||
{this.props.children}
|
||||
</div>;
|
||||
|
||||
ReactDOM.render(content, getOrCreateContainer('mx_persistedElement_'+this.props.persistKey));
|
||||
}
|
||||
|
||||
updateChildVisibility(child, visible) {
|
||||
if (!child) return;
|
||||
child.style.display = visible ? 'block' : 'none';
|
||||
|
@ -160,12 +170,6 @@ export default class PersistedElement extends React.Component {
|
|||
}
|
||||
|
||||
render() {
|
||||
const content = <div ref={this.collectChild} style={this.props.style}>
|
||||
{this.props.children}
|
||||
</div>;
|
||||
|
||||
ReactDOM.render(content, getOrCreateContainer('mx_persistedElement_'+this.props.persistKey));
|
||||
|
||||
return <div ref={this.collectChildContainer}></div>;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue