React.js <select>不触发onChange

Question

我使用标签构建了一个简单的无状态组件。 每次选择一个选项时，不会调用onChange事件。偶尔会调用一次（在随机选择多个项目之后）。 TestList类扩展了Component {     handleSelectListChange =事件=> {         console.log（“ CLICKED” + event.target.value）;     };     getList =（）=> {         let options = [];         for（让i = 0; i <10; i ++）{             options.push（ {“ ITEM” + i} ）;         }         返回（                              {选项}                      ）;     };     渲染=（）=> {         让列表= this.getList（）;         返回（             

{list}

        ）;     }; } 导出默认的TestList; 为什么没有在每次单击项目时触发我的onChange？

Answer 1

更改

中的代码

 <select size={20} onChange={this.handleSelectListChange}>

到

<select size={20} onChange={this.handleSelectListChange.bind(this)}>

Answer 2

它正常工作。

import { Component } from "react";

import React from "react";

class TestList extends Component {

handleSelectListChange = event => {
    console.log("CLICKED " + event.target.value);
};

getList = () => {
    let options = [];
    for (let i = 0; i < 10; i++) {
        options.push(<option key={i} value={i}>{"ITEM " + i}</option>);
    }

    return (
        <select size={20} onChange={this.handleSelectListChange}>
            {options}
        </select>
    );
};

render = () => {
    let list = this.getList();

    return (
        <div>{list}</div>
    );
};
}
export default TestList;