Question

我是初学者。我创建了一个表单来获取用户名，但是每当在控制台中检查输入时，输入始终是不确定的。我不知道会有什么反应，因此将不胜感激

import React, { Component } from 'react';

class App extends Component{
  constructor(props){
    super(props);
    this.state={
      name:''
    }
  this.handleSubmit=this.handleSubmit.bind(this);
  this.handleChange=this.handleChange.bind(this);
}

  handleSubmit=(e)=>{
    console.log(this.name)
  
  }
  handleChange=(e)=>
  {
    this.setState({
      [e.target.name]: e.target.value,
    });
  }

  render(){
    return(
      <form >
        <input type="text" onChange={this.handleChange}/>
        <button onClick={this.handleSubmit} >add</button>
      </form>
    );
  }
}

export default App;

Answer 1

您在这里：

import React, { Component } from 'react';

class App extends Component {
    constructor(props) {
        super(props);
        this.state = {
            name: '',
            email: ''
        }
    }

    handleSubmit = (e) => {
        e.preventDefault()
        console.log(this.state)

    }
    handleChange = (e) => {
        this.setState({
            [e.target.name]: e.target.value,
        });
    }

    render() {
        return (
            <form onSubmit={this.handleSubmit}>
                <input type="text" name='name' onChange={this.handleChange} value={this.state.name} />
                <input type="text" name='email' onChange={this.handleChange} value={this.state.email} />
                <button type='submit'>add</button>
            </form>
        );
    }
}

export default App;

来自反应形式的未定义输入

1 个答案: