Je suis nouveau pour réagir et juste commencer avec la manipulation des événements, mais en écrivant une simple fonction Onsubmit, je reçois l'erreur (ne peut pas lire la propriété 'State' de non définie).
Je sais que cela peut être corrigé par mais pourquoi ne pas travail? Je viens d'appeler une fonction d'une application de classe à l'aide de Pourquoi est-ce que j'ai obtenu .Ce alors comment est-ce non défini ? non défini une erreur lorsque j'accède à la fonction de la même classe en utilisant .Ce dans la fonction de rendu?
3 Réponses :
onSubmitFunct = (event) => {
event.preventDefault();
console.log(this.state.term);
}
because in react this keyword is accessible by binding the created function in constructor or by using arrow Function,and the arrow function is giving that feature by default in reactjs
Vous devez ajouter un bouton d'envoi pour soumettre votre formulaire
import React from 'react';
import ReactDom from 'react-dom';
class APP extends React.Component{
state={
term : ''
}
onSubmitFunct = (event) => {
event.preventDefault();
console.log(this.state.term);
}
render(){
return(
<div className="frm">
<form onSubmit={this.onSubmitFunct}> //why this doen't work
<div className='infrm'>
<label>Enter Text </label>
<input type="text"
value={this.state.term }
onChange={e => this.setState({term:e.target.value})}
/>
// add submit button for submitting form
<button type="submit">
</div>
</form>
</div>
);
}
}
Vous devez lier la méthode dans le constructeur.
class APP extends React.Component {
constructor(props) {
super(props);
this.state = { term: '' };
this.onSubmit = this.onSubmit.bind(this); // Bind method like this...
}
onSubmit(event) {
event.preventDefault();
console.log(this.state.term);
}
render() {
return (
<div className="frm">
<form onSubmit={this.onSubmit}>
<div className='infrm'>
<label>Enter Text
<input type="text" value={this.state.term} onChange={e =>
this.setState({ term: e.target.value })} />
</label>
</div>
<input type="submit" value="Submit" />
</form>
</div>
);
}
}