2017-12-28 1 views
0

표시되는 오류 : 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> 
 
     ); 
 
    } 
 
}

답변

0

실제로 '@ devexpress/dx-react-grid-bootstrap3'의 표 대신 VirtualTableView를 사용하여 변경된 경우 @ischenkodv

0

확인을합니다. 이것에

"@devexpress/dx-react-core": "^1.0.0-beta.1", 
"@devexpress/dx-react-grid": "^1.0.0-beta.1", 
"@devexpress/dx-react-grid-bootstrap3": "^1.0.0-beta.1", 

:

"@devexpress/dx-react-core": "1.0.0-beta.1", 
"@devexpress/dx-react-grid": "1.0.0-beta.1", 
"@devexpress/dx-react-grid-bootstrap3": "1.0.0-beta.1", 

dx-react-grid-bootstrap3 버전 ^1.0.0-beta.1는 beta.2 내가 같은 문제가 있었이에서 내 package.json을 변경하여 고정 (16) 반응을 요구하면서 15 반응과 호환 그리고 나서 npm install 후에 (React v15로) 잘 동작합니다.

관련 문제