Asp.net mvc 为什么函数中的函数不会被调用？

我有下面的代码来生成两个下拉列表，其中ddlproducts通过ddlCategories选择加载。但是，当我调用函数getDataById并试图打印ajax填充的数组data2以发出警报时，没有警报—有两个警报—没有任何警报被提示。它在IE控制台上显示了此错误消息

执行未到达函数getDataById，因为该函数中的警报甚至没有执行

SCRIPT438:对象不支持属性或方法“getDataById”

更正：一旦this.props.getDataById的调用更改为this.getDataById，它就工作了

但是如何填充DDL产品下拉列表。如何访问DDL产品的标签，然后向其添加选项

代码如下：

var gdata=[];

var trStyle = {
    'color': 'black',
    'border-style' :'solid',
    'margin-left':'20%'
};

var HCOMP = React.createClass({
    getInitialState:function(){
    return{data1:[], data2:[], isMounted:false, selectedValue:0}
},
componentDidMount:function(){
    this.getData();
    this.setState({isMounted:true})
},
ddlProdCatsChanegeEvent: function(e) {

    if (this.state.isMounted)
    {
        var newV = ReactDOM.findDOMNode(this.refs.refProdCats).value;        
        var seleValue = newV;

        this.setState({selectedValue:newV}, function(){

           this.getDataById(this.state.selectedValue);
            alert(this.state.data2);
        });
    }
},
render: function() {
    var prodCats = this.state.data1.map(function(ele, index){// <PRODCATSOPTION optValue={ele.ProductCategoryID} optText={ele.Name} />
        return <option value={ele.ProductCategoryID} data-key={index}>{ele.Name}</option>
    });

    prodCats.unshift(<option value={''}>{'---- select category ------'}</option>)

    return (<div>Prodcut Category:<br /><select id="ddlCategories"  ref="refProdCats" onChange={this.ddlProdCatsChanegeEvent}>{prodCats}</select><br />
        Products:<br /><select id="ddlPorducts" ref="refProds"></select><br /></div>
      )
},
getDataById:function(catId){
    var x = catId;
    alert('rec id:'+x);

    $.ajax({
        url:'http://localhost:53721//Home/GetProductCats?id='+ x,
        method:'GET',
        success:function(d1){
            this.setState({data2:d1});
        }.bind(this),
        error:function(){
            alert('ERROR');
        }.bind(this)
    })
},
getData:function(){
    //ajax here
    $.ajax({
        url:'http://localhost:53721//Home/GetProductCats',
        method:'GET',
        success:function(d1){
            this.setState({data1:d1});
        }.bind(this),
        error:function(){
            alert('ERROR');
        }.bind(this)
    })
}
});

var PRODOPTIONS = React.createClass({
    render:function(){
        return(<option value={this.props.optValue}>{this.props.optText}</option> )
    }

});

var PRODCATSOPTION = React.createClass({
    render:function(){
        return(<option value={this.props.optValue}>{this.props.optText}</option> )
    }

});




ReactDOM.render( <HCOMP/>,  document.getElementById('d1') );

---

尝试将ddlprodcatschangeevent更新为ddlPropCatsChangeEvent。

尝试将ddlprodcatschangeevent更新为ddlPropCatsChangeEvent。

我更新了代码，而不是从props调用“getDataById”，我将其称为this.getdatabydthis.state.selectedValue。好消息是，现在所有警报都显示数据，但使用我当前的代码，如何填充下拉列表。我已经包含了引用，但是如何将集合添加到DDLProducts？我更新了代码，而不是从props中调用“getDataById”，我将其称为this.getDataById this.state.selectedValue。好消息是，现在所有警报都显示数据，但使用我当前的代码，如何填充下拉列表。我已经包含了参考文献，但如何将集合添加到DDL产品中？