Как я мог бы использовать только элементы в массиве объектов, которые соответствуют вводимым пользователем данным

#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
});
  

в обоих случаях результатом является массив объектов, которые соответствуют критериям