Using data from array list in react-native

Question

I´m learning to use apis and i have this array from an api

{
"candidate_id":1244,
 "candidate_name": "ABRAHAM",
 "vData": [
        {
            "document_name": "Identificación",
            "document_status": 0,
            "kind_document": 1,
            "document_route": "",
            "required": false
        },
        {
            "document_name": "Comprobante de domicilio",
            "document_status": 0,
            "kind_document": 2,
            "document_route": "",
            "required": true
        },
        {
            "document_name": "Estado de cuenta",
            "document_status": 0,
            "kind_document": 3,
            "document_route": "",
            "required": true
        },
        {
            "document_name": "Doc. Datos Personares",
            "document_status": 0,
            "kind_document": 25,
            "document_route": "",
            "required": false
        }
    ]
}

I can acces to the array this way console.log('lista: ', arrPayroll.archivo); but I dont know how to spilt an use the content of it I need to make something like

setvDocNameIdentificacion(vData.document_name);
setvKindDocument1(vData.kind_document);

where i want that vData.document_name is "Identificacion" and vData.kind_document is 1

//////////EDIT/////// what I need is a way to use the data inside of vData array to make some validations, so i need to put every elemnt of the arrays on diferent variables

for example since the first object on vData is

"document_name": "Identificación",
"document_status": 0,
"kind_document": 1,
"document_route": "",
"required": false

i need to use the elements to do something like this

setvDocumentName("Identificación")
setvDocumentstatus(0)
setvKindDocument(1),
setvDocument_route("")
setvRequired(false)

so i can use them for making views like

{vKindDocument == 1 ? 
<Text style={styles.PaymentText}>El documento es {vDocumentName} </Text>
:
<Text style={styles.PaymentText}>No hay documento</Text>
}

any advice would be appreciated

Could you be more clear? Below answers are what you are looking for or not? If not, could you add a comment on answer explaining what do you want? — Giovanni Esposito
– Giovanni Esposito, Commented Aug 4, 2021 at 8:26
i edited the post, im trying to be more clear, the answers dont worked for me — user10625391
– user10625391, Commented Aug 4, 2021 at 8:44
I saw and thanks for that. I'm trying to answer to your question. — Giovanni Esposito
– Giovanni Esposito, Commented Aug 4, 2021 at 8:46

Giovanni Esposito · Accepted Answer · 2021-08-04 08:55:44Z

1

You need to find at first the element in the array and then create 5 state variables in which store all the informations you need to render your Text. Something like:

const [vDocumentName, setvDocumentName] = useState("");
const [vDocumentstatus, setvDocumentstatus] = useState(-1);
const [vKindDocument, setvKindDocument] = useState(-1);
const [vDocument_route, setvDocument_route] =useState("");
const [vRequired, setvRequired] = useState(false);

useEffect(() => {
   // retrieve data from api...
   let elementINeedToRender = arrPayroll.archivo.vData.find(x => x.document_name === "Identificación" && x.kind_document === 1);
   setvDocumentName(elementINeedToRender.document_name);
   setvDocumentstatus(elementINeedToRender.document_status);
   setvKindDocument(elementINeedToRender.kind_document);
   setvDocument_route(elementINeedToRender.document_route);
   setvRequired(elementINeedToRender.required);
}, []);

...

{vKindDocument == 1 ? 
<Text style={styles.PaymentText}>El documento es {vDocumentName} </Text>
:
<Text style={styles.PaymentText}>No hay documento</Text>
}

Now your view shows <Text style={styles.PaymentText}>El documento es Identificación </Text>

answered Aug 4, 2021 at 8:55

Giovanni Esposito

11.3k1 gold badge19 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Giovanni Esposito Over a year ago

@user10625391 no problem man, have a nice coding =)

Alixsep · Accepted Answer · 2021-08-04 08:08:22Z

Question you asked was not clear enough but I assume you wanna find all the objects where the document_name is "Identificacion" and kind_document is 1.

You can use filter method and it returns an array:

let response = {
"candidate_id":1244,
 "candidate_name": "ABRAHAM",
 "vData": [
        {
            "document_name": "Identificación",
            "document_status": 0,
            "kind_document": 1,
            "document_route": "",
            "required": false
        },
        {
            "document_name": "Comprobante de domicilio",
            "document_status": 0,
            "kind_document": 2,
            "document_route": "",
            "required": true
        },
        {
            "document_name": "Estado de cuenta",
            "document_status": 0,
            "kind_document": 3,
            "document_route": "",
            "required": true
        },
        {
            "document_name": "Doc. Datos Personares",
            "document_status": 0,
            "kind_document": 25,
            "document_route": "",
            "required": false
        }
    ]
};

console.log(response.vData.filter(el => (el["document_name"] === "Identificación" && el["kind_document"] === 1)));

Abrah_dago_313 · Accepted Answer · 2021-08-04 08:08:30Z

0

You can use .find of js array this:

const found = {You object}?.vData?.find(lookFor => {
  if (condition) {
    return 1;
  }
  return -1;
})

if (found) {
  /* your code like setvDocNameIdentificacion(found?.document_name); */
}

answered Aug 4, 2021 at 8:08

Abrah_dago_313

2101 silver badge7 bronze badges

Collectives™ on Stack Overflow

Using data from array list in react-native

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related