{header}
Nous insérons la variable d'en-tête "header" en sortie dans le rendu, en utilisant des accolades.
Exemple d'affichage conditionné :
Display the header only if username is defined:
class MyForm extends React.Component {
constructor(props) {
super(props);
this.state = { username: '' };
}
myChangeHandler = (event) => {
this.setState({username: event.target.value});
}
render() {
let header = '';
if (this.state.username) {
header = <h1>Hello {this.state.username}</h1>;
} else {
header = '';
}
return (
<form>
{header}
<p>Enter your name:</p>
<input
type='text'
onChange={this.myChangeHandler}
/>
</form>
);
}
}
ReactDOM.render(<MyForm />, document.getElementById('root'));
Syntaxe pour insérer en sortie la variable "header" dans le render ?