在 React.js 中使用 jQWidgets答案

【问题标题】：Use of jQWidgets in React.js在 React.js 中使用 jQWidgets
【发布时间】：2018-03-10 08:12:41
【问题描述】：

我是 React 新手，想使用 jQWidgets 库：

https://www.jqwidgets.com/reactjs-components-documentation/

因此，我使用此链接设置了package.json，创建了文件夹jqwidgets-react 和jqwidgets，并按照他们的要求放置了所需的.js 文件 https://www.jqwidgets.com/reactjs-components-documentation/documentation/create-react-app/index.htm?search=

现在，当我转到我的 app.js 文件并导入任何文件时，它会显示“找不到模块”，如下所示：

import JqxDateTimeInput from './jqwidgets-react/react_jqxdatetimeinput';

编译失败。

./src/layouts/report_definition/step_one.js 中的错误找不到模块： ./jqwidgets-react/react_jqxdatetimeinput in /home/amit/identity_pp/src/layouts/report_definition

@./src/layouts/report_definition/step_one.js 61:30-81

【问题讨论】：

标签： reactjs jqxgrid jqwidget

【解决方案1】：

首先我们需要全局安装 Create React App，这样我们就可以使用它的命令： npm install -g create-react-app

创建一个 Create React App 应用程序：创建反应应用程序我的应用程序

集成 jQWidgets React 组件在 src 文件夹中添加一个 assets 文件夹，其中包含 jqwidgets 和 jqwidgets-react 文件夹：

最后在 App.js 文件中编写你的小部件代码：

import React, { Component } from 'react';

import JqxDateTimeInput from './assets/jqwidgets-react/react_jqxdatetimeinput';

class App extends Component {
    render() {
        return (
            <div>
                <h4>My First jQWidgets React Component</h4>
                <JqxDateTimeInput width={200} height={30} />
            </div>
        );
    }
}

export default App;

【讨论】：