¿Cómo puedo insertar un salto de línea en un componente de texto en React Native?
Quiero insertar una nueva línea (como \r\n,
) en un componente de Texto en React Native.
Si tengo:
<text><br />
Hi~<br >
this is a test message.<br />
</text>
Luego React Native renderiza Hi~ this is a test message.
¿Es posible renderizar texto para agregar una nueva línea de esta manera:
Hi~
this is a test message.
10 answers
No puedo probarlo ahora mismo, pero esto debería hacerlo:
<Text>
Hi~{"\n"}
this is a test message.
</Text>
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-04-04 09:43:58
También puedes hacer:
<Text>{`
Hi~
this is a test message.
`}</Text>
Más fácil en mi opinión, porque no tienes que insertar cosas dentro de la cadena; simplemente envuélvela una vez y mantiene todos tus saltos de línea.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-11-21 06:31:09
Esto funcionó para mí
<Text>{`Hi~\nthis is a test message.`}</Text>
(react-native 0.41.0)
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-02-13 13:47:55
Uso:
<Text>{`Hi,\nCurtis!`}</Text>
Resultado:
Hola,
¡Curtis!
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-05-17 10:25:12
Puede usar {'\n'} como saltos de línea.
Hi~ {'\n'} este es un mensaje de prueba.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-11-17 07:58:23
Si está mostrando datos de variables de estado, use esto.
<Text>{this.state.user.bio.replace('<br/>', '\n')}</Text>
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-06-30 11:51:35
Necesitaba una solución de ramificación de una línea en un operador ternario para mantener mi código bien indentado.
{foo ? `First line of text\nSecond line of text` : `Single line of text`}
El resaltado de sintaxis sublime ayuda a resaltar el carácter de salto de línea:
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-03-31 22:12:31
Puedes intentar usar así
<text>{`${val}\n`}</text>
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-08-29 11:26:11
Use {[0] } en texto y css white-space: pre-wrap;
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-07-24 14:59:25
Agregar una etiqueta de cierre al salto de línea jsx parecía funcionar para mí.
<text>First Line<br></br>Second Line</text>
Salida:
First Line
Second Line
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-09-16 10:19:09