javascript - 如何通过映射函数ReactJS传递this.params

Question

这个问题已经有答案了:

How to access the correct `this` inside a callback (15 个回答)

已关闭 7 年前。

我的父级有两个 Prop :实体和选项。我想为每个实体发送选项作为参数。我怎样才能做到这一点？我尝试过:

class FormsList extends React.Component{
    constructor(props){
        super(props);
    };  
    render(){
        var items = this.props.entities.map(function(entity){
            return(
                <Child data={entity} key={entity.Id} moredata={this.props.options}/>
            );
        });
        return(
            <MuiThemeProvider muiTheme={getMuiTheme()}>
                <List children={items}/>
            </MuiThemeProvider>
        );      
    };
};

我知道在Entity.map函数体中无法访问参数，但是我应该如何将选项传递给子进程？

Answer 1

您需要绑定(bind) map 函数才能访问正确的this。

var items = this.props.entities.map(function(entity){
    return (
        <Child data={entity} key={entity.Id} moredata={this.props.options}/>
    );
}.bind(this);

或者，您可以使用箭头函数语法:

var items = this.props.entities.map(entity => {
    return (
        <Child data={entity} key={entity.Id} moredata={this.props.options}/>
    );
};