javascript - React Native - tavutus

Työskentelen React Native -sovelluksen parissa, jossa näytän tekstiä laatikoiden sisällä. Joskus yksittäiset sanat laatikoissa ovat liian pitkiä mahtuakseen yhdelle riville, joten RN katkaisee sanan automaattisesti, kun se kävisi liian pitkäksi, ja jatkaa tekstiä seuraavalla rivillä. Tämä johtaa valitettavasti huonoon sanojen tavutukseen (katso kuvan vasen laatikko). Yritän löytää ratkaisua tämän parantamiseksi siten, että tässä esimerkissä tulos olisi kuten oikeanpuoleinen laatikko, jossa sana on tavuotettu järkevään kohtaan. Tiedän, että on Javascript-kirjastoja, jotka käsittelevät sanojen tavuamista. Tämä esimerkiksi pilkkoo sanat tavuittain taulukkoon. Olen jumissa tässä, koska minulla ei ole aavistustakaan, miten oikeastaan selvittää, tarvitsetko sanan tavuamista vai et. Onko mitään ideoita?

Vastaus #1

käytä C/C++/Java-koodausta:

text = 'React\u00ADNative'
<Text>{text}</Text>

Vastaus #2

Itse asiassa käytin peni4142:n vastausta tehdakseni funktion, joka palauttaa merkkijonon, joka voidaan katkaista yhdysmerkillä:

const hyphenatedText = (text: string): string => 
  text
    .split(' ')
    .map((word) => word.split('').join('\u00AD'))
    .join(' ');

Nyt, jos sinun hyphenatedText olisi React Native Text -komponentissa, se olisi tavuittain kääritty automaattisesti.