期望一个字符串（对于内置组件）或一个类/函数（对于复合组件）但得到：对象答案

【问题标题】：Expected a string (for built-in components) or a class/function (for composite components) but got: object期望一个字符串（对于内置组件）或一个类/函数（对于复合组件）但得到：对象
【发布时间】：2019-01-28 18:41:48
【问题描述】：

我无法使用我安装的外部模块，我完全按照文档中的说明进行操作。当我在代码沙箱中运行它时它可以工作，但它不能在我自己的开发环境中运行。

这是我的代码：

import React from "react";
import { Treebeard } from "react-treebeard";
import "./custom.css";

const data = {
  name: "root",
  toggled: true,
  children: [
    {
      name: "parent",
      children: [{ name: "child1" }, { name: "child2" }]
    },
    {
      name: "loading parent",
      loading: true,
      children: []
    },
    {
      name: "parent",
      children: [
        {
          name: "nested parent",
          children: [{ name: "nested child 1" }, { name: "nested child 2" }]
        }
      ]
    }
  ]
};

export default class Dialog extends React.Component {
  constructor(props) {
    super(props);

    this.state = {
      access_token: ""
    };
  }

  componentWillMount() {
    const access_token = sessionStorage.getItem("access_token")
      ? sessionStorage.getItem("access_token")
      : "";

    this.setState({ access_token });
  }

  onToggle = (node, toggled) => {
    if (this.state.cursor) {
      this.setState({ cursor: { active: false } });
    }
    node.active = true;
    if (node.children) {
      node.toggled = toggled;
    }
    this.setState({ cursor: node });
  };

  render() {
    return <Treebeard data={data} onToggle={this.onToggle} />;
  }
}

这里是模块documentation的链接

【问题讨论】：

在返回语句上方的渲染函数中声明数据对象字面量，然后重试
您收到的错误信息是什么？

标签： javascript reactjs jsx

【解决方案1】：

我已经使用 create-react-app 和自定义配置进行了测试，但一切正常。这是我的文件，因此您可以检查开发环境中的不同之处

index.js：

import React from "react";
import ReactDOM from "react-dom";
import Dialog from "./Dialog";

ReactDOM.render(
  <div>
    <Dialog />
  </div>,
  document.getElementById("app")
);

package.json:

{
  "name": "test",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "webpack-dev-server --config ./webpack.config.js --mode development"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@babel/core": "^7.2.2",
    "@babel/preset-env": "^7.3.1",
    "@babel/preset-react": "^7.0.0",
    "babel-loader": "^8.0.5",
    "babel-plugin-transform-class-properties": "^6.24.1",
    "webpack": "^4.29.0",
    "webpack-cli": "^3.2.1",
    "webpack-dev-server": "^3.1.14"
  },
  "dependencies": {
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    "react-treebeard": "^3.1.0"
  }
}

我希望这会有所帮助，如果您提供其他文件，我可以检查您的确切配置。

【讨论】：