@sickgang

Как реализовать сортировку по алфавиту в таблице?

Привет!

Есть таблица с 5 колонками, информация прилетает с api, выводится как массив объектов в таком виде:
5f6c7c6297a8f491346172.png
Нужно при клике на один из столбцов, сортировать сначала a-z, и потом если опять происходит клик, то в обратном порядке
Не понимаю как сделать так что бы все обработать одной функцией, передать в аргумент поле столба на который тыкнул, и там в функции его подставить и уже реализовать сортировку, сделал пока так:
<th scope="col" @click="change">Fullname</th>
            <th scope="col" @click="change">Username</th>
            <th scope="col" @click="change">Company</th>
            <th scope="col" @click="change">E-mail</th>
            <th scope="col" @click="change">State</th>


change () {
                this.items.sort((a, b) => {
                    if (a.fullname > b.fullname) return 1
                    if (a.fullname < b.fullname) return -1
              })
        }

При клике сортируется a-z только по полю fullname, при втором клике понятно что ничего не происходит, как можно это реализовать?
Заранее спасибо за ответ!
  • Вопрос задан
  • 67 просмотров
Пригласить эксперта
Ответы на вопрос 1
Kozack
@Kozack Куратор тега Vue.js
Thinking about a11y
Не проверял, но по моему достаточно прокидывать в обработчик название поля и уже по нему сортировать
Примерно так:
<th scope="col" @click="change('fullname')">Username</th>
<th scope="col" @click="change('company')">Company</th>

change (field) { // ...
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
27 окт. 2020, в 15:42
1000 руб./в час
27 окт. 2020, в 15:30
100000 руб./за проект
27 окт. 2020, в 15:28
100000 руб./за проект