반응 부트 스트랩 테이블 정렬이 숫자 필드에서 올바르게 작동하지 않습니다.

Question

Firebase Realtime Database에서 프런트 엔드 용 ReactJS를 사용하는 프로젝트가 있습니다. react-bootstrap-table은 데이터 목록에 사용됩니다. 숫자 입력란에서 정렬이 제대로 작동하지 않습니다. 해당 필드의 데이터 유형을 변경하도록 API/플러그인을 찾을 수 없습니다. 에 의해

기본 분류 : 가격 - 내림차순으로 정렬

: 용량 -

내림차순

<BootstrapTable data={this.state.posts} striped hover search pagination exportCSV options={ options }> 
    <TableHeaderColumn dataField="id" isKey dataAlign="center" hidden>Key</TableHeaderColumn> 
    <TableHeaderColumn dataField="capacity" dataSort>Capacity</TableHeaderColumn> 
    <TableHeaderColumn dataField="location" dataSort>Location</TableHeaderColumn> 
    <TableHeaderColumn dataField="price" dataSort>Price</TableHeaderColumn> 
    <TableHeaderColumn dataField="createdByLong" valueField="id" dataSort dataFormat={this.dateFormatter}>Created By</TableHeaderColumn> 

Answer 1

나는이 낡은 것을 알고 있지만, 경우에 당신이 해결책을 발견하지 않았습니다

항목에 대한

JSON 구조는이 도움이 될 수 있습니다.

정렬 기능이 기본적으로 알파벳순 인 것처럼 보입니다.

숫자 정렬을 적용하려면 숫자 정렬을 적용하려는 열에서 sortFunc을 사용하고 숫자 정렬을 수행하는 사용자 지정 콜백 함수를 제공하십시오. 이 말이

function numericSortFunc(a, b, order) { 
    if (order === 'desc') { 
    return Number(b.price) - Number(a.price); 
    } else { 
    return Number(a.price) - Number(b.price); 
    } 
} 

<BootstrapTable data={this.state.posts} striped hover search pagination exportCSV options={ options }> 
    … 
    <TableHeaderColumn dataField="price" dataSort sortFunc={ numericSortFunc }>Price</TableHeaderColumn> 
    … 
</BootstrapTable> 

희망 :

예를 들어, 가격에,이 같은 numericSortFunc 기능을 추가!