时间戳

首页 > 解决方案 > 尝试渲染组件时类型无效

reactjs - 尝试渲染组件时类型无效

问题描述

我正在尝试在 Meteor React 应用程序中使用 FlowRouter 和 react-mounter，但收到以下错误消息：

警告：React.createElement：类型无效——需要一个字符串（对于内置组件）或一个类/函数（对于复合组件）但得到：对象。

client/main.html体内有这个 div：

<div id="root"></div>

与client/main.jsx：

import React from "react";
import { Meteor } from "meteor/meteor";
import { render } from "react-dom";
import { App } from "/imports/ui/App";
import "/client/router";

Meteor.startup(() => {
  render(<App/>, document.getElementById("root"));
});

client/router.jsx有这条路线：

import React from "react";
import { FlowRouter } from "meteor/ostrio:flow-router-extra";
import { mount, withOptions } from "react-mounter";

import App from "/imports/ui/App";
import Start from "/imports/ui/Start";

const mount2 = withOptions({
  rootId: "root"
}, mount);

FlowRouter.route("/", {
  name: "Start",
  action() {
    console.log("start");
    mount2(App, {
      content: <Start />
    });
  }
});

imports/ui/App.jsx：

import React from "react";

export const App = ({content}) => {
  console.log("content", content);
  return <div>{content}</div>
};

内容打印undefined。

以及imports/ui/Start.jsx我要渲染的组件：

import React from "react";

export const Start = () => (
  <div>
    start
  </div>
);

我错过了什么？

标签： reactjsmeteorflow-router

解决方案

我的问题是导入/client/router.jsx应该有大括号，如：

import { App } from "/imports/ui/App";
import { Start } from "/imports/ui/Start";

推荐阅读