React를 처음 사용했으며 https://github.com/facebookincubator/create-react-app에서 시작 프로젝트를 사용하고 있습니다. https://github.com/IgniteUI/igniteui-react에서 IgniteUI 그리드를 사용하려고합니다.React에서 IgniteUI 그리드 구성 요소를 사용하는 동안 오류가 발생했습니다.
내 자바 스크립트에 <IgGrid />
태그를 사용하려고합니다. 다음과 같이
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;
된 index.html은 다음과 같습니다 :
난 다음받을 오류 다음과 같이
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 코드를 호출하기 위해 사용입니다
<!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>
index.js는 다음과 같습니다 :
import React from 'react';
import ReactDOM from 'react-dom';
import UIGrid from './components/grid/UIGrid'
import './index.css';
ReactDOM.render(
<UIGrid />,
document.getElementById('root')
);
igniteui-react.min.js 스크립트는 프로젝트의 scripts 폴더에 포함되어 있습니다.
내 프로젝트에서 그리드를 구현하는 올바른 방법을 찾고 있습니다.
도움을 주시면 감사하겠습니다. 감사합니다.