首页 > 解决方案 > 嵌套返回语句中的“这是未定义的”

问题描述

我正在尝试将一些道具mapObject={this.props.mapObject} details={this.props.parsedData.categories[key]传递给另一个组件Item,但我得到了TypeError: this is undefined

道具被正确传递,因为我可以在我调用的第一行访问它们mapObject。只有在嵌套return中我似乎无法访问它们。我的代码如下。

class List extends React.Component {
    constructor(props) {
        super(props);
    }

    render() {
        return (
            this.props.mapObject(this.props.parsedData.categories, function (key, value) {
                return (
                    <div id="dropdown">
                        <div id="category-cirle"><center>{key[0].toUpperCase() + key[1]}</center></div>
                        <div id="dropdown-content">
                            <Item key={key} mapObject={this.props.mapObject} details={this.props.parsedData.categories[key]} />
                        </div>
                    </div>
                );
            })
        );
    }
}

我如何将道具传递给Item

标签: javascriptreactjs

解决方案


您使用 afunction作为 的第二个参数mapObjects,因此this在函数中不是指您的组件类。尝试改用箭头语法,这将保留以下内容this

this.props.mapObjects(this.props.parsedData.categories, (key, value) => {
    return ...
});

推荐阅读