试图使用JS对象填充组件,但得到“函数作为子函数无效”?

我是个新手,所以如果这是个简单的问题,请原谅我。

我正在尝试使用JavaScript对象:

const gameCardData = {
  "university": {
    "elemental-wars": {
      "imgAlt": "Elemental Wars Start Screen",
      "imgPath": "../img/games/ElementalWars.png",
      "cardHeader": "Elemental Wars",
      "cardShortText": "A tactical game about using your units and spells to outsmart an opposing mage",
      "cardPlatforms": "Windows",
      "cardDate": "2018",
      "cardEngine": "Unity",
      "cardRoles": "Lead Programmer"
    }
  }
};

export default gameCardData;

来填充某些组件。我的想法是为“大学”里的每个孩子准备一张卡片,上面写着一些信息。但当我尝试调用此函数时:

getGameCards = category => () => {
    let data = gameCardData[category];
    return(
        <div>
            <ComplexCard
                imgAlt="Image alt"//{game.imgAlt}
                imgPath={require("../img/games/ElementalWars.png")}//game.imgPath)}
                cardHeader="Elemental Wars"//{game.cardHeader}
                cardShortText="A tactical game about using your units and spells to outsmart an opposing mage"//{game.cardShortText}
                cardPlatforms="Windows"//{game.cardPlatforms}
                cardEngine="Unity"//{game.cardEngine}
                cardRoles="Lead Programmer"//{game.cardRoles}
                cardDate="2018"//{game.cardDate}
            />
        </div>
    );
};

警告:函数作为子函数无效。如果返回组件而不是从渲染返回组件,则可能会发生这种情况。或者你是想调用这个函数而不是返回它。

class ComplexCardGrid extends Component {
...
    render() {
        return(
            <div>
                {this.getGameCards("university")}
            </div>
        );
    }
}

在你开口之前,是的,我知道 getGameCards 还没有使用我提供的数据,但这只是为了在我使用for循环根据提供的数据创建所有卡之前获得一个工作示例。

但我该如何摆脱这个警告呢?我想这是关于React的一些基本问题,我不理解,因为当我在Google上查找这个问题时,它的解决方案似乎不一样。