Apparently div keys prevent unnecessary renders

1 files changed, 2 insertions, 2 deletions

diff --git a/src/App.js b/src/App.js
index ac2b4ad..cce1e3c 100644
--- a/src/App.js
+++ b/src/App.js
@@ -221,7 +221,7 @@ class TerminalManager extends React.Component {
     console.log(this.state.terminals[id]);
 
     let arr = [
-      <div className={(this.state.curTermID === 0) ? "" : "invisDiv"}>{this.state.terminals[0]}</div>
+      <div key={this.state.terminals[0].key} className={(this.state.curTermID === 0) ? "" : "invisDiv"}>{this.state.terminals[0]}</div>
     ]
     console.log("i " + 0 + " | (this.state.curTermID === i) = " + (this.state.curTermID === 0));
 
@@ -229,7 +229,7 @@ class TerminalManager extends React.Component {
     {
 
       console.log("i " + i + " | (this.state.curTermID === i) = " + (this.state.curTermID === i));
-      arr.push(<div className={(this.state.curTermID === i) ? "" : "invisDiv"}>{this.state.terminals[i]}</div>);
+      arr.push(<div key={this.state.terminals[i].key} className={(this.state.curTermID === i) ? "" : "invisDiv"}>{this.state.terminals[i]}</div>);
     }
 
     console.log("arr");