我遇到了一个问题，当我运行我的应用程序时，我无法输入文本，由于"this。setState不是一个函数。我正在练习react.js。
我不知道这里的问题，我是新的反应，不知道如何使用绑定来克服这个问题，所以我决定问这里。第一个帖子!
Uncaught TypeError: this。SetState不是一个函数
constructor(props){super(props);
this.state = {
db: '',
username: '',
fullname: '',
phonenumber: '',
dob: ''
}
this.interface = this.interface.bind(this);
}
componentDidMount(){
this.setState({
db: StartFirebase()
});
}
render(){
return(
<>
<label>Enter Username</label>
<input type='text' id="userbox" value={this.state.username}
onChange={e => {this.SetState({username: e.target.value});}}/>
<br></br>
<label>Enter Fullname</label>
<input type='text' id="namebox" value={this.state.username}
onChange={e => {this.SetState({username: e.target.value});}}/>
<br></br>
<label>Enter Phonenumber</label>
<input type='text' id="phonebox" value={this.state.username}
onChange={e => {this.SetState({username: e.target.value});}}/>
<br></br>
<label>Choose Day of Birth</label>
<input type='text' id="datebox" value={this.state.username}
onChange={e => {this.SetState({username: e.target.value});}}/>
<br></br>
<button id="addBtn" onClick={this.interface}>Add Data</button>
<button id="updateBtn" onClick={this.interface}>Update Data</button>
<button id="deleteBtn" onClick={this.interface}>Delete Data</button>
<button id="SelectBtn" onClick={this.interface}>Get Data from DB</button>
</>
)
}
interface(event){
const id = event.target.id
if(id=='AddBtn'){
this.insertData();
}
else if(id=='updateBtn'){
// this.insertData();
}
else if(id=='DeleteBtn'){
// this.insertData();
}
else if(id=='selectBtn'){
// this.insertData();
}
}
GetAllInputs(){
return {
username: this.state.username,
name: this.state.fullname,
phone: Number(this.state.phonenumber),
dob: this.state.dob
}
}
try change SetState to SetState
constructor(props){super(props);
this.state = {
db: '',
username: '',
fullname: '',
phonenumber: '',
dob: ''
}
this.interface = this.interface.bind(this);
}
componentDidMount(){
this.setState({
db: StartFirebase()
});
}
render(){
return(
<>
<label>Enter Username</label>
<input type='text' id="userbox" value={this.state.username}
onChange={e => {this.setState({username: e.target.value});}}/>
<br></br>
<label>Enter Fullname</label>
<input type='text' id="namebox" value={this.state.username}
onChange={e => {this.setState({username: e.target.value});}}/>
<br></br>
<label>Enter Phonenumber</label>
<input type='text' id="phonebox" value={this.state.username}
onChange={e => {this.setState({username: e.target.value});}}/>
<br></br>
<label>Choose Day of Birth</label>
<input type='text' id="datebox" value={this.state.username}
onChange={e => {this.setState({username: e.target.value});}}/>
<br></br>
<button id="addBtn" onClick={this.interface}>Add Data</button>
<button id="updateBtn" onClick={this.interface}>Update Data</button>
<button id="deleteBtn" onClick={this.interface}>Delete Data</button>
<button id="SelectBtn" onClick={this.interface}>Get Data from DB</button>
</>
)
}
interface(event){
const id = event.target.id
if(id=='AddBtn'){
this.insertData();
}
else if(id=='updateBtn'){
// this.insertData();
}
else if(id=='DeleteBtn'){
// this.insertData();
}
else if(id=='selectBtn'){
// this.insertData();
}
}
GetAllInputs(){
return {
username: this.state.username,
name: this.state.fullname,
phone: Number(this.state.phonenumber),
dob: this.state.dob
}
}