Question

在尝试通过键来对对象数组进行排序时，我遇到问题，发生的事情是我对我的数组进行了排序，然后调用了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)

setState之后的

console.log（），不再排序：

(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保留排序后的数组？

编辑：我正在使用getDerivedStateFromProps（）

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

反应对象的setState排序数组

0 个答案: