표시되는 오류 : bundle.js : 1517 경고 : React.createElement : 유형이 잘못되었습니다 - 예상되는 문자열 (기본 제공 구성 요소의 경우) 또는 클래스/함수 (복합 구성 요소)하지만 얻은 : 정의되지 않은. 정의한 파일에서 구성 요소를 내보내는 것을 잊었을 가능성이 큽니다. PluginHost$$1
의 렌더링 방법을 확인하십시오. (ProductsAndComponentsForLibrary에 의해 생성 된) div의 (ProductsAndComponentsForLibrary에 의해 생성 된) div의 (ProductAndComponentsForLibrary에 의해 생성 된) div의 $$ 1 (ProductsAndComponentsForLibrary에 의해 생성 된) Grid $$ 1의 Grid (생성 된 Grid $$ 1)의 PluginHost $$ 1
이 관련 코드를 설치 반응 그리드의 버전과
import React from 'react';
import {
PagingState,
LocalPaging,
} from '@devexpress/dx-react-grid';
import {
Grid,
Table,
TableHeaderRow,
TableColumnResizing,
PagingPanel,
} from '@devexpress/dx-react-grid-bootstrap3';
import Chip from 'material-ui/Chip';
import ProductsComponentsOfLibrary
from '../../../services/dependencyManager/database/LoadProductsAndComponentsUsingLibrary';
import LoadingScreen from '../Common/LoadingScreen';
const columns = [
{ name: 'Number', title: '' },
{ name: 'ProductName', title: 'The Product Name' },
{ name: 'ProductVersion', title: 'The Product Version' },
{ name: 'ProductLevelDependency', title: 'Product Level Dependency' },
{ name: 'ComponentName', title: 'Component Name' },
{ name: 'ComponentVersion', title: 'Component Version' },
{ name: 'ComponentType', title: 'Component Type' },
];
export default class ProductsAndComponentsForLibrary extends React.PureComponent {
/**
* @class ProductsForLibrary
* @extends {Component}
* @param {any} props props for constructor
* @description Sample React component
*/
constructor(props) {
super(props);
this.state = {
tRows: [],
showTable: false,
columnWidths: {
Number: 100,
ProductName: 350,
ProductVersion: 160,
ProductLevelDependency: 200,
ComponentName: 400,
ComponentVersion: 200,
ComponentType: 200,
},
expandedRows: [],
libraryName: '',
libraryVersion: '',
loading: '',
numberOfRecords: 0,
};
this.loadTable = this.loadTable.bind(this);
}
componentWillReceiveProps(props) {
if (props.renderCondition) {//eslint-disable-line
this.setState({
libraryName: props.nameLibrary,//eslint-disable-line
libraryVersion: props.versionLibrary,//eslint-disable-line
numberOfRecords: 0,
showTable: false,
});
this.loadTable(props.nameLibrary, props.versionLibrary);
}
}
/**
* Load Products and Components using the given library
*/
loadTable(lName, lVersion) {
ProductsComponentsOfLibrary.getProductsAndComponentsUsingLibrary(lName, lVersion).then((response) => {
let i = 0;
const array = [];
if (response.data.length > 0) {
for (i; i < response.data.length; i++) {
array[i] = {
Number: ++i,
ProductName: response.data[--i].PRODUCT_NAME,
ProductVersion: response.data[i].PRODUCT_VERSION,
ProductLevelDependency: response.data[i].PRODUCT_LEVEL_DEPENDENCY,
ComponentName: response.data[i].COMPONENT_NAME,
ComponentVersion: response.data[i].COMP_VERSION,
ComponentType: response.data[i].COMP_TYPE,
};
}
} else {
array[0] = 'No results';
}
this.setState({
tRows: array,
numberOfRecords: response.data.length,
showTable: true,
});
});
}
render() {
let returnView;
if (this.props.renderCondition) {
if (this.state.showTable) {
returnView = (
<div>
{this.state.numberOfRecords > 0 ?
<div>
<div>
<Chip>
{this.state.numberOfRecords} results are returned
</Chip>
</div>
<Grid
rows={this.state.tRows}
columns={columns}
>
<PagingState
defaultCurrentPage={0}
pageSize={12}
/>
<LocalPaging />
<Table />
<TableColumnResizing defaultColumnWidths={this.state.columnWidths} />
<TableHeaderRow allowResizing />
<PagingPanel />
</Grid>
</div>
:
<Chip>
No Libraries Found
</Chip>
}
</div>
);
} else {
returnView = (
<LoadingScreen />
);
}
}
return (
<div>
{returnView}
</div>
);
}
}