Реагирует на сортировку массива объекта setState - PullRequest
0 голосов
/ 21 марта 2019

У меня проблема при попытке отсортировать массив объектов по ключу в реакции, происходит то, что я сортирую свой массив, затем вызываю this.setState(), и мой массив больше не сортируется ..

вот мой метод:

sortby = (key) => {
    function compare(a,b) {
      console.log(a[key])
      if (a[key] > b[key]) return -1;
      if (a[key] < b[key]) return 1;
      return 0;
    }
    let arr = [...this.state.stats]
    arr.forEach(item => item[key] = this.numberConvert(item[key])) //made to convert "1 253 453" to 1253453 (number)
    arr.sort(compare);
    arr.forEach(item => item[key] = this.numberChange(item[key])) // same in the other way
    console.log(arr) // array successfuly sorted
    this.setState({ stats: arr }, () => console.log(this.state.stats))//no more sorted and displayed data changes but is not sorted...
  }

Вот как выглядят данные, которые я сортирую:

Первый console.log (), отсортированный по ключу 'perte'

(10) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
0: {name: "guylee", perte: "22 822 082", tape: "12 237 592", kd: "0.54", kr: "1 019 799"}
1: {name: "Darkelito", perte: "7 581 626", tape: "10 493 667", kd: "1.38", kr: "807 205"}
2: {name: "leparesseux", perte: "6 045 731", tape: "17 586 184", kd: "2.91", kr: "1 352 783"}
3: {name: "adndid", perte: "2 300 000", tape: "1 742 718", kd: "0.76", kr: "174 272"}
4: {name: "capricorne", perte: "1 200 000", tape: "93 181", kd: "0.08", kr: "15 530"}
5: {name: "mac17", perte: "1 200 000", tape: "258 928", kd: "0.22", kr: "86 309"}
6: {name: "Warjack69", perte: "587 200", tape: "209 803", kd: "0.36", kr: "41 961"}
7: {name: "shmell", perte: "500 000", tape: "98 830", kd: "0.20", kr: "49 415"}
8: {name: "akhyo", perte: "440 000", tape: "182 029", kd: "0.41", kr: "26 004"}
9: {name: "Topnaunau", perte: "323 750", tape: "97 457", kd: "0.30", kr: "24 364"}
length: 10
__proto__: Array(0)

console.log () после setState, больше не сортируется:

(10) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}]
0: {name: "Darkelito", perte: "7 581 626", tape: "10 493 667", kd: "1.38", kr: "807 205"}
1: {name: "guylee", perte: "22 822 082", tape: "12 237 592", kd: "0.54", kr: "1 019 799"}
2: {name: "leparesseux", perte: "6 045 731", tape: "17 586 184", kd: "2.91", kr: "1 352 783"}
3: {name: "capricorne", perte: "1 200 000", tape: "93 181", kd: "0.08", kr: "15 530"}
4: {name: "adndid", perte: "2 300 000", tape: "1 742 718", kd: "0.76", kr: "174 272"}
5: {name: "akhyo", perte: "440 000", tape: "182 029", kd: "0.41", kr: "26 004"}
6: {name: "Warjack69", perte: "587 200", tape: "209 803", kd: "0.36", kr: "41 961"}
7: {name: "Topnaunau", perte: "323 750", tape: "97 457", kd: "0.30", kr: "24 364"}
8: {name: "mac17", perte: "1 200 000", tape: "258 928", kd: "0.22", kr: "86 309"}
9: {name: "shmell", perte: "500 000", tape: "98 830", kd: "0.20", kr: "49 415"}
length: 10
__proto__: Array(0)

Как я могу заставить setState сохранить отсортированный массив?

Edit: я использую getDerivedStateFromProps ()

static getDerivedStateFromProps (nextProps, prevState) {
    if(prevState.stats !== nextProps.stat) {
      return {
        stats: nextProps.stat
      };
    } else {
      return null
    }
  }
...