Question

我在代码中找不到导致此错误的问题

这种格式在我以前的项目中效果很好

如果我注释掉handleOptionChange，它将呈现没有错误

从'react'导入React，{组件}; 从“ ../Teams/TeamName.js”中导入{名称}；导入'./PredictionHome.css'; 从“ react-router-dom”导入{Link}；从'./default.png'导入def;

class PredictionHome扩展了组件{ constructor（）{ 超（）; this.state = { 输入：null， } }

handleOptionsChange = (event) => {
    this.setState({
        input: event.target.value
    });
}

render() {
    console.log(this.state.name);
    return(
        <div>
            <div className="split left scrollable">
                <div className="pb7 centered white">
                    <img src={def} alt="Avatar woman" />
                    <h2>Team Name</h2>
                    <select className='br4 bg-blue' id='select1' value={this.state.option} onChange={this.handleOptionsChange}> 
                        <option className='bg-white blue' value='1' >SRH</option>
                        <option className='bg-white blue' value='2' >MI</option>
                        <option className='bg-white blue' value='3' >CSK</option>
                        <option className='bg-white blue' value='4' >KXIP</option>
                        <option className='bg-white blue' value='5' >DC</option>
                        <option className='bg-white blue' value='6' >RR</option>
                        <option className='bg-white blue' value='7' >RCB</option>
                        <option className='bg-white blue' value='8' >KKR</option>
                    </select>
                </div>
            </div>

            <div className="split right scrollable">
                <div className="pb7 centered">
                    <img src={def} alt="Avatar man" />
                    <h2>Team Name</h2>
                    <select className='br4 bg-blue' id='select2' value={this.state.option} onChange={this.handleOptionsChange}>
                          <option className='bg-white blue' value='1'>SRH</option>
                          <option className='bg-white blue' value='2'>MI</option>
                          <option className='bg-white blue' value='3'>CSK</option>
                          <option className='bg-white blue' value='4'>KXIP</option>
                          <option className='bg-white blue' value='5'>DC</option>
                          <option className='bg-white blue' value='6'>RR</option>
                          <option className='bg-white blue' value='7'>RCB</option>
                          <option className='bg-white blue' value='8'>KKR</option>
                    </select>
                </div>
            </div>  
        </div>
    );
}

}

导出默认PredictionHome;

Answer 1

我认为问题不在于handleOptionsChange 我对您的代码有以下观察：-

1）您已经创建了输入状态变量并将其设置在handleOptionsChange中，但是您没有在jsx中使用此状态变量。

2）您已绑定状态变量option用于两者选择输入，而未在handleOptionsChange中设置其值或在代码中的任何地方。

您应该为选择输入设置不同的状态变量，并在handleOptionsChange更改处理程序中设置其值。

Answer 2

我明白了。
代码很好
节点依赖关系树中存在一个问题 babel-eslint 9.0.0，我添加了.env文件来修复它，这导致了一些编译问题

无论如何都要感谢@tarzen chugh的回答

在ReactJS中未定义'handleOptionsChange'no-undef

2 个答案: