8

チャット セッションのリストを表示するがListViewあります (Whatsapp/Facebook Messenger に似ています) rowHasChanged

rowHasChanged: (r1, r2) => r1.id !== r2.id

を使用しても、更新されていないアイテムが再レンダリングされていることに気付きましたshouldComponentUpdate

いくつかのトレースの後、dataSource のクローンを作成する前に項目を別の方法で並べ替えたため (新しいメッセージにより項目がリストの一番上にジャンプする)、rowHasChanged異なる行を比較していることがわかりました。そうするのは理にかなっています。

しかし、パフォーマンスの高い方法で並べ替えをサポートするためのソリューションはありませんか? WPF では、同じ問題のために、データに加えて並べ替えるものをCollectionViewSource受け取った がありました (フィルタリングなどもサポートされていました)。

これらの冗長なレンダリングを取り除く方法を知っている人はいますか?

4

1 に答える 1

0

このようにdataSourceを使用していますか?

this.setState({
    dataSource: this.ds.cloneWithRows(rowData)
});

次のように使用してみてください。

this.setState(state => ({
    dataSource: this.state.dataSource.cloneWithRows(rowData)
}))

最初の状況では、新しい値を dataSource に設定しているため、rowHasChanged を使用せず、新しい dataSource のように受け取ります。

于 2017-03-15T06:44:13.937 に答える