search in array of object in react

Question

i use this lib to show my array https://github.com/oblador/react-native-collapsible and get array from API and use Redux-Thunk . now i want to search in array this is my sample of data :

(3) [{…}, {…}, {…}]
0: {HARDWAREID: 420474797787, NICKNAME: "رضا نوری پور ایران 62 - 374 ع 66", SENTDATE: "14:47", XPOINT: 51.2906833, YPOINT: 35.6797716, …}
1: {HARDWAREID: 409792319815, NICKNAME: "ایران 78 - 875 ع 73", SENTDATE: "14:47", XPOINT: 55.35633, YPOINT: 29.964019, …}
2: {HARDWAREID: 2225434572, NICKNAME: "عابدین پور 938ع43", SENTDATE: "1398-06-19 17:54", XPOINT: 49.49388, YPOINT: 37.47155, …}

for search box i use this lib https://react-native-training.github.io/react-native-elements/

this is code of search box:

<SearchBar
                        placeholder="جستجو"
                        onChangeText={this.updateSearch}
                        value={search}
                        containerStyle={{ backgroundColor: '#fff', borderRadius: 13,borderWidth:0.4, padding: 5,margin:8,height:50,width:wp('95%'),textAlign:'right'}}
                        inputContainerStyle={{ backgroundColor: '#fff',}}
                    />

in 'onChange' use this code :

updateSearch = search => {
        this.setState({search:search})
       // console.log(search)
       var found = this.props.data.find(function(element) {
        return element.POSDESCRIPTION.i === search;
     });
     console.log(found)
    };

but in console.log get "undifind".

i read some post but didn't get answer : method find javascript deep array object RN react native , How to filter array of objects in react native? , Finding an object in array and taking values from that to present in a select list , How to find object in array and show it in React component? how to fix it?? thank for helping.

updtade: this is my reducer:

import {GET_HARDWARE_START,GET_HARDWARE_SUCSSES,GET_HARDWARE_FAILED} from '../types';
let initialState = {
    data:'',
    isLoading:false,
    error:null
}

export default user = (state=initialState,action)=> {
    switch (action.type) {
        case GET_HARDWARE_START:
           return Object.assign({},state,{isLoading:true})  
         case GET_HARDWARE_SUCSSES:
                //console.log("this log from reducer:" + action.payload)
               // return action.payload
               return Object.assign({},state,{data: action.payload ,isLoading:false})   
        case GET_HARDWARE_FAILED:
           return Object.assign({},state,{error:action.payload,isLoading:true})  
        default:
            break;
    }
    return state
}

and this is my conole.log in 'updateSearch' methode : https://i.stack.imgur.com/iycqW.png

UPDATE 2: completed data get from API :

0:
CONTACTPERSONID: 2017011300
ENABLEPOLL: 0
HARDWAREID: 409792319815
LANDMARKID: 0
MESSAGETIME: "1دقيقه پيش"
MOVINGSTATE: "m"
NICKNAME: "ایران 78 - 875 ع 73"
POSDESCRIPTION: "ايران: استان كرمان - محور انار به شهربابك - 72 كيلومتر از  انار"
SENTDATE: "17:39"
SENTDATE1: "1398-06-23 17:39:16"
SIGNATURE: "1-Normal"
SPEED: 95
TRUCKSTATE: "در حال حرکت"
VEHICLETYPE: 0
XPOINT: 55.026634
YPOINT: 30.249145

The issue is that, the api calls are asynchronous, so you won't get the data right away. If you console.log(this.props.data) in the updateSearch, what do you see? — Praneeth Paruchuri, Sep 11 '19 at 10:43
yes i get my data in componentDidMount get data correctly @paruchuri-p — Amir Farahani, Sep 11 '19 at 10:51
And you sure that your data satisfies this condition? `element.POSDESCRIPTION.i === search;`? — Praneeth Paruchuri, Sep 11 '19 at 11:27
i don't know about condition and this is my question.my sample data in line 1 of this post @paruchuri-p — Amir Farahani, Sep 11 '19 at 11:43
Yeah, I see that. The problem is that I don't see enough to say if the array's object shave a property called `POSDESCRIPTION` and if they do how, I don't know how that object looks. — Praneeth Paruchuri, Sep 11 '19 at 12:25
@PraneethParuchuri thank for helping me. i've update my answer inUPDATE2 . show my complete data From API — Amir Farahani, Sep 14 '19 at 13:13

score 0 · Accepted Answer · answered Sep 22 '19 at 06:21

UPDATE :

i change code and get true :

const data = _.filter(this.props.data,user=>{  
           console.log(user.POSDESCRIPTION)
         if (user.POSDESCRIPTION.includes(search))  {

             return true
         }else {
             return false
         }
        });
        console.log("data serach is : " +JSON.stringify(data) )
       // this.setState({activeSections:data})
        this._updateSections(data)
        this.setState({search:search})

search in array of object in react

1 Answers1