Блог

Главная - Вопросы по программированию - Условный рендеринг строки var

Условный рендеринг строки var

#reactjs #string #react-native #conditional-statements #var

Вопрос:

Как показано ниже, у меня есть текст, который отображает текст таким образом.

адрес, дополнительная информация

 <Text subtitle gray>
  {address} ", "
  {additionalInfo}
</Text>

Однако я хочу переписать его так, чтобы текст отображался

адрес, (разрыв строки) Дополнительная информация

Но если {AdditionalInfo}=null, я хочу, чтобы он отображался

адрес

^без перелома линии.

Как мне это сделать?

Заранее спасибо

Комментарии:

1. {additionalInfo? `${address}, ${additionalInfo}` :address } ?

2. Извините, я не уверен, почему это не показало разрыв строки в моем вопросе выше. Но чтобы уточнить, я хочу, чтобы это было так — адрес, (новая строка ниже) Дополнительная информация

Ответ №1:

Лучшей практикой будет всегда проверять, установлена переменная или нет.

 <Text subtitle gray>
{address ? address : ""} ", "
{additionalInfo ? additionalInfo : ""}
</Text>

Комментарии:

1. Ваше решение всегда будет показывать «, » независимо от того, существуют ли какие-либо переменные.

Ответ №2:

Я полагаю, вам нужен разрыв строки, если существуют обе переменные, верно?

 <Text subtitle gray>
  {!additionalInfo ? address : `${address},n${additionalInfo}` }
</Text>

Комментарии:

1. Извините, я ищу противоположное. Поэтому, если {AdditionalInfo}=null, то взлома строки нет.

2. @rbq10 Да, именно так. Если [НЕТ дополнительной информации amp;amp; ДА адрес] => НЕТ взлома строки ><— Другие ответчики сосредотачиваются на этом, Если [ДА Дополнительная информация amp;amp; ДА адрес] => ДА взлома строки <— Другие ответчики сосредотачиваются на этом, Если [ДА дополнительная информация amp;amp; ДА адрес] => Ты хочешь прорыва линии или нет. Потому что другие ответы не касаются этой части.

3. Да, вы правы @Ziwon. Если [НЕТ дополнительной информации amp;amp; ДА адрес] => НЕТ взлома линии

4. Все ответы до сих пор-это не то, что я искал. Не уверен, насколько яснее я могу быть, ага

Ответ №3:

Попробуйте это

 <Text subtitle gray>
 {additionalInfo
     ? `${address} ,${additionalInfo}` 
     : `${address} ${additionalInfo}`
 }
</Text>
Метки: