Question

我正在对Modal Window中的表进行排序。我写了这段代码，但这是不正确的。

<ExtendedModalBar
  list={this.state.modalList}
  onCancel={this.handleExtendedModalClose}
  onSave={(...args) => this.handleSaveFromModal(...args)}
  selectedItems={this.state.modalItems}
  show={this.state.showExtendedModal}
  type={this.state.modalType}
  //onClick={this.onSort('', )}
  sortColumn={this.onSort('isSecure', this.state.modalList); this.onSort('profile', this.state.modalList)}
/>

我的功能：

 onSort = (column, dataToSort) => (event) => {
    const direction = this.state.sort.column ? (this.state.sort.direction === 'asc' ? 'desc' : 'asc') : 'desc';

    dataToSort.sort((a, b) => {
      if ( typeof(a[column]) === 'string' && typeof(b[column]) === 'string' ) {
        const nameA = a[column].toUpperCase(); // ignore upper and lowercase
        const nameB = b[column].toUpperCase(); // ignore upper and lowercase

        if (nameA < nameB ) {
          return -1;
        }
        if (nameA > nameB) {
          return 1;
        }
        // names must be equal
        return 0;
      }

      if( typeof(a[column]) === 'number' && typeof(b[column]) === 'number'){
        return a[column] - b[column];
      }

      if(typeof(a[column]) === 'boolean' && typeof(b[column]) === 'boolean'){
        const firstBool = +(a[column]);
        const secondBool = +(b[column]);
        return firstBool - secondBool;
      }

    }
    );

    if (direction === 'desc') {
      dataToSort.reverse();
    }

    this.setState({
      sort: {
        column,
        direction,
      }
    });
  };

我的排序函数接受两个参数columnName和data。如果我只在onClick中调用一次函数，它将仅对一列进行排序。如何多次调用函数并传递不同的参数，即不同的列名？

Answer 1

问题可能与以下内容有关：onClick属性期望只是一个功能。我会尝试这样的事情：

onClick={(event) => 
    this.onSort('isSecure', this.state.modalList)(event); 
    this.onSort('profile', this.state.modalList)(event);
}

或一些更优雅但等效的代码。希望对您有所帮助-卡洛斯（Carlos）

如何在onClick React中使用不同的参数调用SAME函数的多个实例？

1 个答案: