Sto cercando di rendere un paragrafo non appena si fa clic sul pulsante.
Ecco il mio codice.
import React, { Component } from 'react'; class App extends Component { constructor() { super(); this.createText = this.createText.bind(this); } createText() { return( hello friend
) } render() { return ( ); } } export default App;
Qui sto cercando di rendere “ciao amico” quando si fa clic sul pulsante. Ma non sta funzionando.
Questo non è il modo corretto perché createText
è un gestore di eventi che non renderà l’elemento, ciò di cui hai bisogno è “Rendering condizionale di elementi”.
Controlla documenti per ulteriori dettagli Rendering condizionale .
passi:
1- Utilizzare una variabile di stato con valore iniziale false
.
2- Onclick del pulsante aggiorna il valore su true
.
3- Usa quel valore di stato per il rendering condizionale.
Codice di lavoro:
class App extends React.Component { constructor() { super(); this.state = { isShow: false } this.createText = this.createText.bind(this); } createText() { this.setState({ isShow: true }) } render() { return ( {this.state.isShow && Hello World!!!
} ); } } ReactDOM.render( , document.getElementById('app'))