Я пытаюсь отсортировать массив объектов на основе параметра ключа и значения, используя созданные мной функции реакции - PullRequest
0 голосов
/ 11 марта 2019

У меня есть список пользовательских объектов в массиве. Я хочу отсортировать разных пользователей в массиве на основе выбранных параметров, таких как возраст, ранг, ... Я создал функции, которые будут использовать, чтобы позволить пользователю выбирать, как ранжируются рансеры. Я пытаюсь сделать функции фильтрации, но они не работают, как я ожидал. вот моя реактивная составляющая:

export default class Table extends Component {
    constructor(props) {
        super(props);
        this.state = {
            users: usersJSON,
            sort: this.props.filter
        }
        console.log(this.state.users)
    }

    componentWillReceiveProps() {

    }

    // complete the comparators
    compareByAge(a, b) {

    }

    compareByName(a, b) {

    }

    compareByPoints(a, b) {

    }

    compareByRank(a, b) {

    }

    render() {

        return (<div>
            <table className='table table-striped'>
                <thead>
                    <tr key='head'>
                        <th>Age</th>
                        <th>Name</th>
                        <th>Points</th>
                        <th>Rank</th>
                    </tr>
                </thead>
                <tbody>
                {
                    this.state.users.map((user, index) => {
                        return(
                            <tr key={index}>
                                <td>{user.age}</td>
                                <td>{user.name}</td>
                                <td>{user.points}</td>
                                <td>{user.rank}</td>
                            </tr>
                        )
                    })
                }
                </tbody>
            </table>
        </div>)
    }
}

Я пытался:

    compareByAge(a, b) {
    if(a < b){
        return -1
    }
    if(a = b){
        return 0
    }
    if(a > b){
        return 1
    }
}

compareByName(a, b) {
    if(a < b){
        return -1
    }
    if(a = b){
        return 0
    }
    if(a > b){
        return 1
    }
}

compareByPoints(a, b) {
    if(a < b){
        return -1
    }
    if(a = b){
        return 0
    }
    if(a > b){
        return 1
    }
}

compareByRank(a, b) {
    if(a < b){
        return -1
    }
    if(a = b){
        return 0
    }
    if(a > b){
        return 1
    }
}

а вот и пользовательские объекты

[ { rank: 3, points: 3123, name: 'Marlana J. Huff', age: 41 },                                                                                                                                                                                                                                                                                                 
  { rank: 10, points: 45345, name: 'Susan D. Jimenez', age: 42 },                                                                                                                                                                                                                                                                                              
  { rank: 14, points: 312, name: 'Richard M. Mass', age: 11 },                                                                                                                                                                                                                                                                                                 
  { rank: 13, points: 3124, name: 'Joan T. Covert', age: 13 },                                                                                                                                                                                                                                                                                                 
  { rank: 20, points: 31, name: 'Joseph S. Perez', age: 23 },                                                                                                                                                                                                                                                                                                  
  { rank: 19, points: 6546, name: 'John R. Green', age: 24 },                                                                                                                                                                                                                                                                                                  
  { rank: 9, points: 452, name: 'Elizabeth R. Olsen', age: 15 },                                                                                                                                                                                                                                                                                               
  { rank: 1, points: 134, name: 'Sharon R. Ryan', age: 25 },                                                                                                                                                                                                                                                                                                   
  { rank: 24, points: 64563, name: 'Stacey D. Ward', age: 30 },                                                                                                                                                                                                                                                                                                
  { rank: 2, points: 755463, name: 'George K. Pancoast', age: 35 },                                                                                                                                                                                                                                                                                            
  { rank: 18, points: 42342, name: 'Dorothy J. Carroll', age: 33 },                                                                                                                                                                                                                                                                                            
  { rank: 23, points: 1241, name: 'Louis E. McCrae', age: 65 },                                                                                                                                                                                                                                                                                                
  { rank: 15, points: 654645, name: 'Camille B. Burton', age: 17 },                                                                                                                                                                                                                                                                                            
  { rank: 4, points: 5345345, name: 'Tommye R. Robinson', age: 18 },                                                                                                                                                                                                                                                                                           
  { rank: 17, points: 342, name: 'Grace C. Smith', age: 19 },                                                                                                                                                                                                                                                                                                  
  { rank: 22, points: 213, name: 'Jennifer C. West', age: 20 },                                                                                                                                                                                                                                                                                                
  { rank: 25, points: 34242, name: 'John L. Sandlin', age: 21 },                                                                                                                                                                                                                                                                                               
  { rank: 21, points: 52342, name: 'Margarita D. Lambert', age: 43 },                                                                                                                                                                                                                                                                                          
  { rank: 5, points: 42342, name: 'Thomas M. Hawkins', age: 32 },                                                                                                                                                                                                                                                                                              
  { rank: 8, points: 354, name: 'Joseph J. Freeman', age: 22 },                                                                                                                                                                                                                                                                                                
  { rank: 6, points: 7675, name: 'Arlene R. Grimes', age: 29 },                                                                                                                                                                                                                                                                                                
  { rank: 7, points: 274, name: 'Michael E. Rogers', age: 10 },                                                                                                                                                                                                                                                                                                
  { rank: 12, points: 105, name: 'Alice J. Goldsmith', age: 37 },                                                                                                                                                                                                                                                                                              
  { rank: 16, points: 18978, name: 'Robert O. Lambert', age: 40 },                                                                                                                                                                                                                                                                                             
  { rank: 11, points: 103596, name: 'Felix M. Seeber', age: 39 } ]          

Ответы [ 2 ]

0 голосов
/ 11 марта 2019

Функциональный код ниже вызывает ряд функций через curry . Так что синтаксис выглядит немного странно. Чтобы использовать этот функциональный код, вы вызываете sort, за которым следуют два набора скобок. Первый набор содержит ссылку на массив данных, а второй набор содержит строку, представляющую «ключ», по которому вы хотите отсортировать. Получив отсортированные данные, вы можете просто использовать setState(), чтобы поместить отсортированный список в переменную состояния users.

Таким образом, sort(data)('name'); отсортирует массив объектов с именем data по ключу name. Вы увидите вызов функции в console.log() ниже:

const data = [ { rank: 3, points: 3123, name: 'Marlana J. Huff', age: 41 },                                                               { rank: 10, points: 45345, name: 'Susan D. Jimenez', age: 42 },                                                                         { rank: 14, points: 312, name: 'Richard M. Mass', age: 11 },                                                                             { rank: 13, points: 3124, name: 'Joan T. Covert', age: 13 },                                                                             { rank: 20, points: 31, name: 'Joseph S. Perez', age: 23 },                                                                             { rank: 19, points: 6546, name: 'John R. Green', age: 24 },                                                                             { rank: 9, points: 452, name: 'Elizabeth R. Olsen', age: 15 },                                                                           { rank: 1, points: 134, name: 'Sharon R. Ryan', age: 25 },                                                                               { rank: 24, points: 64563, name: 'Stacey D. Ward', age: 30 },                                                                           { rank: 2, points: 755463, name: 'George K. Pancoast', age: 35 },                                                                       { rank: 18, points: 42342, name: 'Dorothy J. Carroll', age: 33 },                                                                       { rank: 23, points: 1241, name: 'Louis E. McCrae', age: 65 },                                                                           { rank: 15, points: 654645, name: 'Camille B. Burton', age: 17 },                                                                       { rank: 4, points: 5345345, name: 'Tommye R. Robinson', age: 18 },                                                                       { rank: 17, points: 342, name: 'Grace C. Smith', age: 19 },                                                                             { rank: 22, points: 213, name: 'Jennifer C. West', age: 20 },                                                                           { rank: 25, points: 34242, name: 'John L. Sandlin', age: 21 },                                                                           { rank: 21, points: 52342, name: 'Margarita D. Lambert', age: 43 },                                                                     { rank: 5, points: 42342, name: 'Thomas M. Hawkins', age: 32 },                                                                         { rank: 8, points: 354, name: 'Joseph J. Freeman', age: 22 },                                                                           { rank: 6, points: 7675, name: 'Arlene R. Grimes', age: 29 },                                                                           { rank: 7, points: 274, name: 'Michael E. Rogers', age: 10 },                                                                           { rank: 12, points: 105, name: 'Alice J. Goldsmith', age: 37 },                                                                         { rank: 16, points: 18978, name: 'Robert O. Lambert', age: 40 },                                                                         { rank: 11, points: 103596, name: 'Felix M. Seeber', age: 39 } ]          

let sort = (data) => (key) => [...data].sort((first, second) => first[key] > second[key]);

console.log(sort(data)('rank'));
console.log(sort(data)('points'));
console.log(sort(data)('name'));
console.log(sort(data)('age'));
0 голосов
/ 11 марта 2019

Если вы хотите, чтобы он был отсортирован по возрасту по умолчанию, вы можете установить его в состояние непосредственно, как показано ниже:

this.state = {
            users: usersJSON.sort(this.compareByAge),
            sort: this.props.filter
        }

Попробуйте эту функцию,

compareByName(a, b) {
    if(a.name < b.name){
        return -1
    }
    if(a.name == b.name){ // you were making mistake here by a = b instead of a==b
        return 0
    }
    if(a.name > b.name){
        return 1
    }
}

compareByAge(a, b) {
    if(a.age < b.age){
        return -1
    }
    if(a.age == b.age){
        return 0
    }
    if(a.age > b.age){
        return 1
    }
}

compareByPoints(a, b) {
    if(a.points < b.points){
        return -1
    }
    if(a.points == b.points){
        return 0
    }
    if(a.points > b.points){
        return 1
    }
}

compareByRank(a, b) {
    if(a.rank < b.rank){
        return -1
    }
    if(a.rank == b.rank){
        return 0
    }
    if(a.rank > b.rank){
        return 1
    }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...