matrix/matrix-react-sdk
1
0
Fork 0
mirror of https://github.com/matrix-org/matrix-react-sdk.git synced 2025-11-14 19:02:33 +03:00
Code Activity

Move rendering of PersistedElements into other lifecycle stages

Browse Source 
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:
Travis Ralston
2020-04-01 14:30:57 -06:00
parent 05b58dc81d
commit 0bb8973ee6
1 changed files with 10 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/views/elements/PersistedElement.js
View File

@@ -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>;
}
}