首页 文章

从对象值渲染React元素

提问于
浏览 次
1

我想创建一个对象：

import React from "react";
import { Registration } from "../../";

const RouteObj = {
  Registration: {
    route: "/registration",
    comp: <Registration />
  }
};
export default RouteObj;

然后，在第二个文件调用中：

import React from 'react';
import RouteObj from ...

class Thing extends React.Component{
  render() {
    <RouteObj.Registration.comp />
  }
}

尝试这个时，我得到错误：

React.createElement：type无效 - 期望一个字符串（对于内置组件）或一个类/函数（对于复合组件）但得到：undefined . 您可能忘记从其定义的文件中导出组件 .

是否有可能以这种方式呈现React组件？

javascript reactjs

2 回答

  • 1

    Registration 已经是一个标签（一个组件），这就是为什么我猜你必须使用大括号 .

    import React from 'react';
import RouteObj from ...

class Thing extends React.Component{
  render() {
    <div>
      {RouteObj.Registration.comp}
    </div>
  }
}
    回复于
  • 1
    • 您必须正确导出 RouteObj ，作为默认导出 .

    因此，在声明 RouteObj 之后添加：

    export default RouteObj;

    你错误地试图使用你没有导出的东西 . 因此未定义 .

    • 您无法从元素创建元素，您需要从组件类创建元素 . 因此，您必须将 RouteObj.comp 设置为 Registration ，即组件类本身，而不是 Registration ， <Registration /> 的实例 .

    所以，相反，这应该是 comp 应该是：

    comp: Registration
    回复于

相关问题