react native - How to avoid a whole Text component move to the next line in flexWrap: 'wrap' -
let's take example. have 2 text components below:
<view style={{flexwrap: 'wrap'}}> <text>12345</text> <text>67890</text> </view>
my expected result : (the second text component splitted out , moved next line)
12345678 90
the actual result : (the whole second text component move next line when line not have enough width putting whole text component.)
12345 67890
for purpose, how can change code? lot !!
react native supports nested text componentss, meaning can reference different strings in order result in you've desired. im not tooo sure why doing though :p sample code below. note using flexwrap not required.
<view style = {{width: 50, backgroundcolor: '#e0e0e0'}}> <text>1234578 <text>9123456</text> </text> </view>
with output of below...
hope helps!
edit #1: possible solution?
<view style = {{width: 50, backgroundcolor: '#e0e0e0'}}> <text> {123456789} {412346789} </text> </view>
Comments
Post a Comment