Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

270
Visualizações
Is there a way to use a map inside of another map function?

What I'm trying to do is after a field name, I want to render its type which is in another state as you can see:

my code:

    const FormScreen = ({route}) => {
      const [FieldForm, setFieldForm] = useState([]);
      const [TypeForm, setTypeForm] = useState([]);
    
    useEffect(() => {
      if (userForm.length > 0) {
        return;
      } else {
        setFieldForm(JSON.parse(route.params.paramKey).fields);
        setTypeForm(JSON.parse(route.params.paramKey).type);
        console.log(FieldForm,TypeForm);  // returns me: {"message":["ab","test"],"tipo":["Date","Text"]}
      }
    },[userForm,TypeForm]);   
    return (
      <SafeAreaView style={{flex: 1}}>
        <View>
          <Text>COLLECTION :</Text>
    
          {FieldForm.length > 0 ? (
            FieldForm.map((item) => (          
              <Text key={uuid.v4()}>{item}</Text>
              //Here I want to to map which type is the field(to use conditionals to render) but how can I make it? 
            ))
          ) : (
            <Text key={uuid.v4()}> Loading ...</Text>
          )}
    
        </View>
      </SafeAreaView>
    );
    };

How can I use a map inside of a map to do it, or creating an api call to return the type of the fields?

about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

You can definitely nest the map functions :

const FormScreen = ({route}) => {
      const [FieldForm, setFieldForm] = useState([]);
      const [TypeForm, setTypeForm] = useState([]);
    
    useEffect(() => {
      if (userForm.length > 0) {
        return;
      } else {
        setFieldForm(JSON.parse(route.params.paramKey).fields);
        setTypeForm(JSON.parse(route.params.paramKey).type);
        console.log(FieldForm,TypeForm);  // returns me: {"message":["ab","test"],"tipo":["Date","Text"]}
      }
    },[userForm,TypeForm]);   
    return (
      <SafeAreaView style={{flex: 1}}>
        <View>
          <Text>COLLECTION :</Text>
    
          {FieldForm.length > 0 ? (
            FieldForm.map((item) => (
              <>          
                <Text key={uuid.v4()}>{item}</Text>
                <> {TypeForm.length && TypeForm.map((type) => ( // Return node )) || null};
                </>
              </>
            ))
          ) : (
            <Text key={uuid.v4()}> Loading ...</Text>
          )}
    
        </View>
      </SafeAreaView>
    );
    };
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda