Outils pour utilisateurs

Outils du site


dev:reactdiver

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentesRévision précédente
Prochaine révision
Révision précédente
dev:reactdiver [2021/12/28 13:17] sbesteldev:reactdiver [2021/12/28 13:30] (Version actuelle) sbestel
Ligne 1: Ligne 1:
  
 +> console.log(id)
  
  
Ligne 16: Ligne 17:
 === avec BIND === === avec BIND ===
  
-  chandleclick() { console.log("this.state");  }+  handleclick() { console.log("this.state");  }
  
   <button onClick={this.handleclick.bind(this)}>Cliquez moi</button>   <button onClick={this.handleclick.bind(this)}>Cliquez moi</button>
Ligne 22: Ligne 23:
 === avec zero fonction (plug de babel) === === avec zero fonction (plug de babel) ===
  
-  chandleclick() { console.log("this.state");  }+  handleclick() { console.log("this.state");  }
  
   <button onClick={ () => this.handleclick()}>Cliquez moi</button>   <button onClick={ () => this.handleclick()}>Cliquez moi</button>
  
 === avec fonction fléchée (plug de babel) ===  === avec fonction fléchée (plug de babel) === 
-   chandleclick = () => { console.log(this.state);}+   handleclick = () => { console.log(this.state);}
      
    <button onClick={this.handleclick}>Cliquez moi</button>    <button onClick={this.handleclick}>Cliquez moi</button>
Ligne 34: Ligne 35:
  
  
-   chandleclick = () => {+   handleclick = () => {
     this.setState({compteur: this.state.compteur+1});     this.setState({compteur: this.state.compteur+1});
     console.log(this.state);     console.log(this.state);
    }    }
 + ou
 +  handleclick = () => {
 +    const clients = this.state.clients.slice(); 
 +    clients.push({id:4, nom: 'tete'});
 +    this.setState({clients:clients})
 +   };
              
dev/reactdiver.1640697429.txt.gz · Dernière modification : 2021/12/28 13:17 de sbestel