React select onChange不起作用 [英] React select onChange is not working

问题描述

JsFiddle： https://jsfiddle.net/69z2wepo/9956/

JsFiddle : https://jsfiddle.net/69z2wepo/9956/

我在 react.js 代码中的render函数中返回一个select元素。

I am returning a select element in the render function in my react.js code.

但每当我更改 select 值时， onChange 中的函数都不会被触发。

But whenever I change the select value, the function in the onChange is not getting triggered.

var Hello = React.createClass({
render: function() {
    return <select id="data-type" onChange={changeDataType()}>
           <option selected="selected" value="user" data-type="enum">User</option>
           <option value="HQ center" data-type="text">HQ Center</option>
           <option value="business unit" data-type="boolean">Business Unit</option>
           <option value="note" data-type="date">Try on </option>
           <option value="con" data-type="number">Con</option>
      </select>
    }
});


React.render(<Hello/>, document.getElementById('container'));

 function changeDataType() {
    console.log("entered");
}

此功能仅在加载选择时触发一次，随后在我改变价值，不会触发。

This function is getting triggered only once when the select is loaded and subsequently when I change the value, its not getting triggered.

推荐答案

onChange 需要一个函数。

你传递的是 changeDataType（），它正在运行函数 changeDataType 函数，并将 onChange 设置为它的返回值，该值为null。

You are passing it changeDataType(), which is running the function changeDataType function, and setting onChange to it's return value, which is null.

尝试传递实际函数，而不是评估函数。

Try passing the actual function, instead of evaluating the function.

< select id =data-typeonChange = {changeDataType}>

这篇关于React select onChange不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！