leer - mostrar datos json javascript

reaccionar elemento de creación nativo con cadena

Question

Veo mucha gente creando un mapeo de ruta en React nativo similar al siguiente:

if (route.id === ''Blah'') {
return (<Blah prop1={this.method} prop2={this.other method} />);
} else if (route.id === ''OtherView'') {
return (<OtherView prop1={this.method} />);
}

esto puede convertirse rápidamente en muchas líneas de código, me gustaría hacer algo como esto:

return (React.createElement(route.id, {propsToPass}));

Esto no funciona en React Native porque aparentemente ''las cadenas no están permitidas como el primer parámetro en React Native, ya que están destinadas a ser usadas para etiquetas html en React regular''.

Entonces, ¿cómo puede hacerse esto? Lo tengo funcionando si proporciono un ReactClass como primer param o con eval (route.id) (pero sé que puede ser peligroso).

¿Cómo puedo crear un elemento React Native con una cadena?

Answer 1

Puede configurar un espacio de nombres de componentes permitidos:

var routeComponents = {
"Blah": Blah,
"OtherView": OtherView
}
if(routeComponents[route.id]) {
return React.createElement(routeComponents[route.id], {propsToPass});
} else {
// Error
}