Question

我在平面列表中显示一个数组（CatFilterPro），当我按下一个按钮时，我想按价格从高到低的顺序对其进行排序，而当另一个按钮按下时，则相反，下面的代码在第一个中工作正常按，但在第一次排序后无法再次对其进行排序。

lowpricefilter() {

    this.fc= this.state.recentPro2
    this.fc.sort(function(a, b) {
        return Number(a.pro_price) - Number(b.pro_price);
    })
    this.setState({
        CatFilterPro: this.fc,
        modalVisible: false

    })   
}


highpricefilter() {
    this.fc= this.state.recentPro2
    this.fc.sort(function(a, b) {
        return Number(b.pro_price) - Number(a.pro_price);
    })
    this.setState({
        CatFilterPro: this.fc,
        modalVisible: false
    })   
}

Answer 1

sortByDescending = (a, b) => {
  if(a === b) return 0;
  if(a > b) return -1;
  return 1;
};

sortByAscending = (a, b) => a - b;

sort = sortFunction => {
  const { recentPro2: fc } = this.state;
  return fc.sort(sortFunction);
}

lowpricefilter = () => {
  const sortedAscending = this.sort(this.sortByAscending));
  this.setState({
    CatFilterPro: sortedAscending,
    modalVisible: false
  });
}

highpricefilter = () => {
  const sortedDescending = this.sort(this.sortByDescending));
  this.setState({
    CatFilterPro: sortedDescending,
    modalVisible: false
  });
}

Answer 2

您必须将函数绑定到构造函数中

this.highpricefilter = this.highpricefilter.bind(this);
this.lowpricefilter = this.lowpricefilter.bind(this);

反应本机排序问题

2 个答案: