React：在没有 JSX 的情况下集成组件时出错

Question

我是 React JS 的新手，我试图在不使用 JSX 的情况下将组件 https://github.com/AndrewRedican/react-json-editor-ajrm/ 集成到我的应用程序中。

项目不使用import Component from library这样的导入语法，而是使用const Component = require(library)`这样的语法。

有集成组件的sn-p：

  makeMessageElement() {
    const textFieldOptions = {
      width: '100%',
      placeholder: 'Enter message',
      value: this.state.message,
      onChange: (event, value) => {
        this.setState({
          message: value
        })
      }
    }
 
    return React.createElement(JSONInput, textFieldOptions, null)
  }

当我尝试const JSONInput = require('react-json-editor-ajrm') 时，我收到消息：

未捕获的不变违规：元素类型无效：需要字符串（对于内置组件）或类/函数（对于复合组件），但得到：未定义。您可能忘记从定义组件的文件中导出组件，或者您可能混淆了默认导入和命名导入。

当我尝试const {JSONInput} = require('react-json-editor-ajrm') 时，我收到了相同的消息。

当我尝试import JSONInput from "react-json-editor-ajrm"; 时，我收到消息：

未捕获的 Component.js:8
从“react-json-editor-ajrm”导入 JSONInput；
SyntaxError: 意外的标识符

那么，请问导入库的正确方法是什么？

Answer 1

试试 require(path).default:

const JSONInput = require('react-json-editor-ajrm').default

对于more details

Answer 2

你试过了吗：

import * as JSONInput from "react-json-editor-ajrm";

或

import { JSONInput } from "react-json-editor-ajrm";

如果它不起作用，请告诉我，我们将一起研究更多内容：)

根据需要进行编辑：

const JSONInput = require('react-json-editor-ajrm').default