Affichage de réagir-composants natifs de la matrice de

J'ai un tableau de réagir composants natifs et souhaitez afficher toutes à la fois dans un Vue cependant, je reçois l'erreur

RawText [object object] doit être enveloppé dans une Composante explicite

et les afficher dans une Texte ne sera pas obtenir le résultat souhaité, comment dois-je faire.

render()
{
var CompArray = new Array();
CompArray[0] = <TextInput placeholder="First Name"/>
CompArray[1] = <TextInput placeholder="Last Name"/>

var Components = CompArray.join();

return(<View>{Components}</View>);
}
InformationsquelleAutor user55093 | 2017-01-09
  1. 15

    Un excellent moyen de créer une gamme de composants est la création d'un tableau de données et à l'aide d'une carte pour les transformer en composants. Cela permet aussi d'éviter la duplication de code.

    À faire, c'est facile:

    const form = ['First Name', 'Last Name', 'Phone', 'Email', 'Etc']
const textInputComponents = form.map((type)=> <TextInput placeholder={type} />)

    Sur le rendu d'appel de la gamme de composants que vous venez de créer

    render(){
    {textInputComponents}
}

    Ceci est particulièrement utile si votre formulaire/tableau est grand, et vous pouvez même l'utiliser avec un tableau d'objets.

    • quelle est la signification de type ici ? const textInputComponents = formulaire.carte((type)=> <TextInput espace réservé={type} />) puis-je utiliser n'importe quel mot à la place ?
    • Oui, absolument. Le type signifie ici le type de la TextInput. Mais vous pouvez choisir ce que vous voulez.
    InformationsquelleAutor Gui Herzog
  2. 2

    Votre code est bien, mais vous faites une chose qui est de rejoindre le groupe. Vous n'avez pas à le faire.

    render()
{
 var CompArray = new Array();
 CompArray[0] = <TextInput placeholder="First Name"/>
 CompArray[1] = <TextInput placeholder="Last Name"/>
 return(<View>{CompArray}</View>);
 }
    InformationsquelleAutor Praveena