reactjspaginationdevexpress

Property 'containerComponent' is missing in type '{}'


I'm using react to render HTML and I'm using PagingPanel Plugin from react-grid.
However when I add this rule:

import { PagingPanel } from '@devexpress/dx-react-grid';

And in my render() I add this rule:

<PagingPanel />

It gives me the following error:

Type '{}' is not assignable to type 'PagingPanelProps'.
Property 'containerComponent' is missing in type '{}'.

What am I missing?
I'm using PagingPanel inside the grid component also from react-grid

My code inside the render method:

<Grid rows={this.props.ConnectedConnectors}
 columns={[{ name: "guid", title: "Guid" }]}>
 <SortingState sorting={this.props.sorting} onSortingChange={this.props.changeSorting} />
 <SearchState value={this.props.searchValue} onValueChange={this.props.changeSearchValue} />
 <IntegratedFiltering />
 <IntegratedSorting />
 <PagingState pageSize={10} currentPage={this.props.pageNumber} onCurrentPageChange={this.props.changePageNumber} />
 <IntegratedPaging />
 <Table cellComponent={this.renderCell.bind(this)} columnExtensions={this.tableColumnExtensions} tableComponent={TableComponent} />
 <Toolbar />
 <SearchPanel />
 <TableHeaderRow showSortingControls />
 <TableColumnVisibility hiddenColumnNames={hiddenColumnNames} emptyMessageComponent={NoGridColumnsMessage} />
 <PagingPanel />  // the one with the error mark
 <SelectionState  />
 <TableSelection selectByRowClick highlightRow showSelectionColumn={false} key="id" />
</Grid>

Solution

  • Check out the documentation on this component here

    You will want to use a PagingPanel from one of the theme components if you are not providing a custom component.

    Excerpt:

    // Use the following statement to import a plugin with embedded theme components:
    
    import { PagingPanel } from '@devexpress/dx-react-grid-material-ui';
    import { PagingPanel } from '@devexpress/dx-react-grid-bootstrap4';
    import { PagingPanel } from '@devexpress/dx-react-grid-bootstrap3';
    
    // If you want to use custom components, you can import the themeless plugin:
    
    import { PagingPanel } from '@devexpress/dx-react-grid';