diff --git a/src/components/Applause.js b/src/components/Applause.js index 872b80d..49a54ea 100644 --- a/src/components/Applause.js +++ b/src/components/Applause.js @@ -3,13 +3,25 @@ import '../App.css'; class Applause extends React.Component { constructor() { - super (); - this.state = { - numOfClaps: 0 + super() + + let numOfClaps = 0 //Valor default + // O component acabou de inicializar. Vamos buscar a informacao e por numa variavel + let savedData = localStorage.getItem("numOfClaps") + // A saved data é uma string (local storage devolve sempre strings). Mas precisamos de converter para um numero + // Se savedData for null entao o numero default (0) ja esta bom. Nao precisamos de fazer nada + // Mas caso seja diferente de null como verificamos neste if. entao significa que tem la qualquer coisa que precisamos + if (savedData !== null) { + let numOfClaps = parseInt(savedData) + } + + this.state = { // Isto é shorthand syntax para "numOfClaps: numOfClaps", tanto faz. + numOfClaps } } - makeItClap () { + makeItClap () { // Aqui queremos nao so mostrar a alteracao como tambem gravar a mesma + localStorage.setItem("numOfClaps", this.state.numOfClaps + 1) this.setState({ numOfClaps: this.state.numOfClaps + 1 }) @@ -27,4 +39,4 @@ class Applause extends React.Component { } } -export default Applause; \ No newline at end of file +export default Applause;