在reactjs中使用基于类的组件时无法呈现数据列表

Question

我正在尝试从父组件到子组件获取数据列表以显示它，但无法执行此操作

当我试图console.log子它显示的数据，但无法返回div和渲染到屏幕

import React from 'react';

class RenderSub extends React.Component {


    renderedLists = () => {

        this.props.lists.subjects[this.props.lists.sem].map(sub => {
            console.log(sub);
            return (
                <div key={Math.random()}>
                    {sub}
                </div>
            );
        });
    } 

    render() {

        if(this.props.lists.sem === "") {
            return <div></div>;
        }
        return (
            <div>
                {this.renderedLists()}

            </div>
        );
    }

}   

export default RenderSub;

算法的设计与分析

计算机体系结构

数据库管理系统

微处理机

概率与统计

关系数据库管理系统实验室

微处理机

编程

Answer 1

你需要返回数组renderedList

renderedLists = () => {
    return this.props.lists.subjects[this.props.lists.sem].map(sub => {
        console.log(sub);
        return (
            <div key={Math.random()}>
                {sub}
            </div>
        );
    });
} 

render() {
    if(this.props.lists.sem === "") {
        return <div></div>;
    }
    return (
        <div>
            {this.renderedLists()}
        </div>
    );
}