在 react js 组件中未定义

Question

我正在尝试根据输入字段值（react js 中的受控组件）设置状态，但是一旦我尝试更改输入字段的值，该事件总是会导致未定义。

应用程序.js

initialState = {
        set: {
            team1Score: 5,
            team2Score: 6,
        },
    };

handleChange(e) {
        this.setState({
            set: {
                team1Score: e.target.value,
                team2Score: e.target.value,
            }
        });
    }

render() {
return (
   <Match   
       set = {this.state.set}               
       handleChange={(e) => {this.handleChange()}}>
)}

匹配.js

<ScoreInput
  handleChange={props.handleChange}
  set={props.set}
/>

分数输入.js

const ScoreInput = (props) =>

    <div className="c-set-input">
        <input
            className="c-set-input__field"
            placeholder="0"
            value={props.set.team1Score}
            onChange={props.handleChange}
        ></input>
        <span>:</span>
        <input
            className="c-set-input__field"
            placeholder="0"
            value={props.set.team2Score}
            onChange={props.handleChange}
        ></input>
    </div>

Answer 1

您似乎忘记将参数传递给您的 handleChange 函数，所以试试这个

handleChange={(e) => this.handleChange(e)}