fix(squares): destroy squares on unmount

willb335 · Jun 26, 2018 · ac59dc0 · ac59dc0
1 parent 09887c5
commit ac59dc0
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 8 deletions.
diff --git a/src/Chessboard/Square.js b/src/Chessboard/Square.js
@@ -51,6 +51,11 @@ class Square extends Component {
     }
   }
 
+  componentWillUnmount() {
+    const { square } = this.props;
+    this[square].remove();
+  }
+
   render() {
     const {
       connectDropTarget,

diff --git a/src/Demo.js b/src/Demo.js
@@ -14,21 +14,25 @@ const boardStyle = {
 };
 
 class Demo extends Component {
+  state = { keep: true };
   render() {
     return (
       <div style={mainContainer}>
         <div style={title}>Chessboard.jsx</div>
         <div style={boardsContainer}>
           <div>
             <div style={board}>
-              <Chessboard
-                id="standard"
-                calcWidth={calcWidth}
-                position="start"
-                animationOnDrop="rubberBand"
-                sparePieces={true}
-                boardStyle={boardStyle}
-              />
+              <div onClick={() => this.setState({ keep: false })}>Hi!!!</div>
+              {this.state.keep && (
+                <Chessboard
+                  id="standard"
+                  calcWidth={calcWidth}
+                  position="start"
+                  animationOnDrop="rubberBand"
+                  sparePieces={true}
+                  boardStyle={boardStyle}
+                />
+              )}
             </div>
             <div style={boardDescriptions}>
               Standard board with spare pieces