#javascript #reactjs #sorting
#javascript #reactjs #сортировка
Вопрос:
У меня есть тело ответа, которое выглядит примерно так:
{
"id": "provider-a7d49a99-53c0-4b7c-9be3-8b9efc828f1b",
"fullName": "Dr. Tim Lucca, FSE",
"firstName": "Tim",
"lastName": "Lucca",
"prefix": "Dr.",
"suffix": "FSE",
"phone": "(303) 520-4571",
"state": "CO",
"doseSpotID": 185012,
"active": "active",
"capabilities": {
"demographic": [
"adolescent",
"adult",
"child"
],
"geographic": [
"CO",
"TX"
],
"linguistic": [
"english",
"spanish"
],
"credentialedPayors": null
},
"invitePending": false
},
{
"id": "provider-450de310-fcb5-4e71-9d72-b6b320b2eb0a",
"fullName": "Mr Doc Torr",
"firstName": "Doc",
"lastName": "Torr",
"prefix": "Mr",
"suffix": "",
"phone": "(303) 520-4571",
"state": "CO",
"doseSpotID": 186856,
"active": "active",
"capabilities": {
"demographic": [
"adult",
"adolescent",
"child"
],
"geographic": [
"CO",
"TX"
],
"linguistic": [
"english"
],
"credentialedPayors": null
},
"invitePending": false
}
]
У меня есть поле поиска для пользователя, которое они могут искать по fullName
, phone
, и geographic
. Я пытаюсь понять, как отсортировать возвращаемый список и отобразить только те элементы в списке, которые соответствуют вводимым пользователем. Что было бы хорошим способом сортировки массива объектов и создания массива совпадений для поиска пользователей? Прямо сейчас мой компонент просто отображает все возвращенные элементы.
Комментарии:
1. Возможно, вам не нужно сортировать. Просто используйте filter
2. Хорошим способом было бы использовать только элементы, соответствующие ответу.
3. Если бы я использовал .filter, я не уверен, как будет выглядеть внутренняя часть моей функции. Если items — это мой массив объектов, я бы сделал что-то вроде
let list = items.filter( i => ...)
Я вижу только примеры онлайн для проверки длины и не проверяю, соответствуют ли какие-либо значения введенной строке. Какие-либо советы по этому поводу?
Ответ №1:
для точного соответствия я бы сделал это
let to_sort =
[
{
"id": "provider-a7d49a99-53c0-4b7c-9be3-8b9efc828f1b",
"fullName": "Dr. Tim Lucca, FSE",
"firstName": "Tim",
"lastName": "Lucca",
"prefix": "Dr.",
"suffix": "FSE",
"phone": "(303) 520-4571",
"state": "CO",
"doseSpotID": 185012,
"active": "active",
"capabilities": {
"demographic": [
"adolescent",
"adult",
"child"
],
"geographic": [
"CO",
"TX"
],
"linguistic": [
"english",
"spanish"
],
"credentialedPayors": null
},
"invitePending": false
},
{
"id": "provider-450de310-fcb5-4e71-9d72-b6b320b2eb0a",
"fullName": "Mr Doc Torr",
"firstName": "Doc",
"lastName": "Torr",
"prefix": "Mr",
"suffix": "",
"phone": "(303) 520-4571",
"state": "CO",
"doseSpotID": 186856,
"active": "active",
"capabilities": {
"demographic": [
"adult",
"adolescent",
"child"
],
"geographic": [
"CO",
"TX"
],
"linguistic": [
"english"
],
"credentialedPayors": null
},
"invitePending": false
}
]
let user_fullName = 'Dr. Tim Lucca, FSE'
let phone = '(303) 520-4571'
let geographic = 'CO'
let result = to_sort.filter((obj)=>{
if(obj.fullName !== user_fullName){
return false
}
if(obj.phone !== phone){
return false
}
if(!obj.capabilities.geographic.includes(geographic)){
return false
}
return true
});
чтобы проверить, совпадает ли 1 из свойств (не собираюсь вводить данные, это довольно большой)
let user_fullName = 'Dr. Tim Lucca, FSE'
let phone = '(303) 520-4571'
let geographic = 'CO'
let result = to_sort.filter((obj)=>{
if(obj.fullName === user_fullName || obj.phone === phone || obj.capabilities.geographic.includes(geographic)){
return true
}
return false
});
в обоих случаях результатом является массив объектов, которые соответствуют критериям