Reactjs 在React中使用IgniteUI网格组件时出错_Reactjs_Reactive Programming_Infragistics_Ignite Ui_Iggrid

Reactjs 在React中使用IgniteUI网格组件时出错

reactjs

Reactjs 在React中使用IgniteUI网格组件时出错,reactjs,reactive-programming,infragistics,ignite-ui,iggrid,Reactjs,Reactive Programming,Infragistics,Ignite Ui,Iggrid,我是新的反应，我使用的初学者项目从。我正在尝试从中使用IgniteUI网格我试图在javascript中使用标记我发现以下错误： Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. You likely forgot to export your

我是新的反应，我使用的初学者项目从。我正在尝试从中使用IgniteUI网格

我试图在javascript中使用

标记

我发现以下错误：

Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. You likely forgot to export your component from the file it's defined in. Check the render method of `UIGrid`.
    at invariant (invariant.js:44)
    at instantiateReactComponent (instantiateReactComponent.js:77)
    at instantiateChild (ReactChildReconciler.js:44)
    at ReactChildReconciler.js:71
    at traverseAllChildrenImpl (traverseAllChildren.js:77)
    at traverseAllChildrenImpl (traverseAllChildren.js:93)
    at traverseAllChildren (traverseAllChildren.js:172)
    at Object.instantiateChildren (ReactChildReconciler.js:70)
    at ReactDOMComponent._reconcilerInstantiateChildren (ReactMultiChild.js:187)
    at ReactDOMComponent.mountChildren (ReactMultiChild.js:226)

用于调用代码的UIGrid.js如下所示：

import '../scripts/ignite-react.js'
import IgGrid from '../scripts/igniteui-react.min.js';
import React from 'react';


class UIGrid extends React.Component{
render(){
return(
<div id="uigrid">
<h2> Play </h2>
<IgGrid />
</div>

);
}
}

export default UIGrid;

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">  
    <title>React App</title>
  </head>
  <body>
    <div id="root"></div>     
  </body>   
</html>

import React from 'react';
import ReactDOM from 'react-dom';
import UIGrid from './components/grid/UIGrid'
import './index.css';

ReactDOM.render(
  <UIGrid />,
  document.getElementById('root')
);

import'../scripts/ignite react.js'
从“../scripts/igniteui react.min.js”导入IgGrid；
从“React”导入React；
类UIGrid扩展了React.Component{
render（）{
返回(
玩
);
}
}
导出默认UIGrid；

index.html如下所示：

import '../scripts/ignite-react.js'
import IgGrid from '../scripts/igniteui-react.min.js';
import React from 'react';


class UIGrid extends React.Component{
render(){
return(
<div id="uigrid">
<h2> Play </h2>
<IgGrid />
</div>

);
}
}

export default UIGrid;

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">  
    <title>React App</title>
  </head>
  <body>
    <div id="root"></div>     
  </body>   
</html>

import React from 'react';
import ReactDOM from 'react-dom';
import UIGrid from './components/grid/UIGrid'
import './index.css';

ReactDOM.render(
  <UIGrid />,
  document.getElementById('root')
);


反应应用程序

index.js如下所示：

import '../scripts/ignite-react.js'
import IgGrid from '../scripts/igniteui-react.min.js';
import React from 'react';


class UIGrid extends React.Component{
render(){
return(
<div id="uigrid">
<h2> Play </h2>
<IgGrid />
</div>

);
}
}

export default UIGrid;

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">  
    <title>React App</title>
  </head>
  <body>
    <div id="root"></div>     
  </body>   
</html>

import React from 'react';
import ReactDOM from 'react-dom';
import UIGrid from './components/grid/UIGrid'
import './index.css';

ReactDOM.render(
  <UIGrid />,
  document.getElementById('root')
);

从“React”导入React；
从“react dom”导入react dom；
从“./components/grid/UIGrid”导入UIGrid
导入“./index.css”；
ReactDOM.render(
,
document.getElementById（'root'））
);

igniteui-react.min.js脚本包含在项目的脚本文件夹中

正在寻找在我的项目中实现网格的正确方法。

感谢您的帮助。

谢谢

目前还没有现成的解决方案。在创建React包装器时，我们最关心的是让它们通过脚本标记运行，因为最常见的节点样板在使用jQuery、jQuery UI以及Ignite UI时会遇到各种各样的问题。对于Webpack，您可以使用create react应用程序解决大多数问题，但create react应用程序不会公开配置。我们意识到能够在此类应用程序中使用Ignite UI和React包装器是一项重要功能，因此我们目前正在以高优先级进行开发

请关注我们回购协议的发展