-1
エラーメッセージは次のとおりです。 警告：React.createElement：タイプが無効です - 文字列（組み込みコンポーネント用）またはクラス/関数（複合コンポーネント用） ：未定義。コンポーネントが定義されているファイルからコンポーネントをエクスポートするのを忘れた可能性があります。LibrariesOfProductというレンダリング方法を確認してください。 グリッドがDevExtreme ReacGridでレンダリングされない
import React from 'react';
import {
PagingState,
LocalPaging,
} from '@devexpress/dx-react-grid';
import {
Grid,
VirtualTableView,
TableHeaderRow,
TableColumnResizing,
PagingPanel,
} from '@devexpress/dx-react-grid-bootstrap3';
import Chip from 'material-ui/Chip';
import LibrariesOfProd
from '../../../services/dependencyManager/database/LoadProductLibraries';
import LoadingScreen from '../Common/LoadingScreen';
export default class LibrariesOfProduct extends React.PureComponent {
/**
* @class LibrariesOfProduct
* @extends {Component}
* @param {any} props props for constructor
* @description Sample React component
*/
constructor(props) {
super(props);
this.state = {
tRows: [],
showTable: false,
columnWidths: {
Count: 100,
LibraryName: 400,
LibraryVersion: 200,
LibraryType: 200,
LatestVersion: 300,
GroupID: 200,
ArtifactID: 200,
},
columns: [
{ name: 'Count', title: '' },
{ name: 'LibraryName', title: 'Library Name' },
{ name: 'LibraryType', title: 'Library Type' },
{ name: 'LibraryVersion', title: 'Current Version' },
{ name: 'LatestVersion', title: 'Latest Version' },
{ name: 'ArtifactID', title: 'Artifact ID' },
{ name: 'GroupID', title: 'Group ID' },
],
prodName: '',
prodVersion: '',
numberOfRecords: 0,
};
this.loadTable = this.loadTable.bind(this);
}
componentWillReceiveProps(props) {
if (props.renderCondition) {//eslint-disable-line
this.setState({
prodName: props.nameComp,//eslint-disable-line
prodVersion: props.versionComp,//eslint-disable-line
numberOfRecords: 0,
showTable: false,
});
this.loadTable(props.nameComp, props.versionComp);
}
}
/**
* Load libraries of given Product
*/
loadTable(pName, pVersion) {
LibrariesOfProd.getLibrariesOfProduct(pName, pVersion).then((response) => {
let i = 0;
const array = [];
if (response.Libraries.length > 0) {
for (i; i < response.Libraries.length; i++) {
array[i] = {
Count: i + 1,
LibraryName: response.Libraries[i].LIB_NAME,
LibraryType: response.Libraries[i].LIB_TYPE,
LibraryVersion: response.Libraries[i].LIB_VERSION,
LatestVersion: response.Libraries[i].LATEST_VERSION,
GroupID: response.Libraries[i].ARTIFACT_ID,
ArtifactID: response.Libraries[i].GROUP_ID,
};
}
} else {
array[0] = 'No results';
}
this.setState({
tRows: array,
numberOfRecords: response.Libraries.length,
showTable: true,
});
});
}
render() {
let returnView;
const { tRows, columns } = this.state;//eslint-disable-line
console.log(this.state.numberOfRecords);
if (this.props.renderCondition) {
if (this.state.showTable) {
returnView = (
<div>
{this.state.numberOfRecords > 0 ?
<div>
<Chip>
{this.state.numberOfRecords} results are returned
</Chip>
<Grid
rows={tRows}
columns={columns}
>
<PagingState
defaultCurrentPage={0}
pageSize={12}
/>
<LocalPaging />
<VirtualTableView />
<TableColumnResizing defaultColumnWidths={this.state.columnWidths} />
<TableHeaderRow allowResizing />
<PagingPanel />
</Grid>
</div>
:
<Chip>
No Libraries Found
</Chip>
}
</div>
);
} else {
returnView = (
<LoadingScreen />
);
}
}
return (
<div>
{returnView}
</div>
);
}
}警告：React.createElement：タイプが無効です - （複合コンポーネント用）（内蔵部品のための）文字列またはクラス/機能を期待したが得た：未定義。コンポーネントが定義されているファイルからコンポーネントをエクスポートするのを忘れた可能性があります。LibrariesOfProductというレンダリング方法を確認してください。
このエラーが発生した場合の関連コードを入力してください –
私はそれを編集して追加しました。 – JEJC
を確認してください。インポートされたファイルがすべて正しく配信されていることを確認してください –