React-native ListView 排序数据答案

【问题标题】：React-native ListView sort dataReact-native ListView 排序数据
【发布时间】：2019-02-11 03:25:27
【问题描述】：

有人知道如何在 react-native listview 中对数据进行排序吗？

下面是我从 firebase/database 中检索的数据，我想按分数排序，然后呈现类似于排行榜的东西。

(3) [{…}, {…}, {…}]
 0:
  data:{nome: "username", score: 100, status: "in"}
__proto__:Object
 1:{data: {…}}
 2:{data: {…}}
 length:3
__proto__:Array(0)

请看下面的代码：

class Leaderboards extends Component {

  componentWillMount() {
    this.props.leaderboards();
    this.criaFonteDeDados(this.props.leader);
  }

  componentWillReceiveProps(nextProps) {
    this.criaFonteDeDados(nextProps.leader);
  }

  criaFonteDeDados(leader) {
    const ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 });
    this.fonteDeDados = ds.cloneWithRows(leader);
  }

  renderRow(leader) {
    return (
      <View>
        <Text>{leader.data.score}</Text>
        <Text>{leader.data.nome}</Text>
      </View>
    );
  }

  render() {
    return (
      <ListView
        enableEmptySections
        dataSource={this.fonteDeDados}
        renderRow={this.renderRow}
      />
    );
  }
}

const mapStateToProps = state => {
  const leader = _.map(state.LeaderboardsReducer, (val) => {
    return { ...val };
  });
  return { leader };
};

export default connect(mapStateToProps, { leaderboards })(Leaderboards);

【问题讨论】：

标签： firebase listview react-native firebase-realtime-database

【解决方案1】：

从 firebase 获取数据后，您必须对数组进行排序。要按分数排序，您应该有类似

data.sort(function(a,b) {
   return (a.score > b.score) ? 1 : ((b.score > a.score) ? -1 : 0);
});

之后不要忘记使用排序后的数组设置组件状态。

【讨论】：

是的，也可以：）我不知道你在使用 lodash。