Как использовать условие _or_ в строках шаблона?

Question

Я создаю проект с использованием node.js. я использую yo-yo библиотека для создания HTML-шаблонов.

Я хочу добавить обложку из твита пользователя profile_banner_url.

Как это:

const yo = require('yo-yo')
module.exports = function (tweet) {
  return yo`
    <div class='cover'>
      <img src='${tweet.user.profile_banner_url}' />
    </div>
  `
}

Тем не менее, иногда твиты не возвращают profile_banner_url, что приводит к ошибке в браузере.

Я пытался добавить другое изображение из public каталог:

<img src='${tweet.user.profile_banner_url} || otherimg.jpg' />

Но это не сработало.

Какой подход лучше всего использовать or условие в строках шаблона?

Answer 1

Ты ищешь

`<div class='cover'>
  <img src='${tweet.user.profile_banner_url || 'otherimg.jpg'}' />
</div>`

Обратите внимание, что часть внутри ${...} это просто регулярное выражение JavaScript.

Answer 2

Я предполагаю, что теперь можно использовать нулевой оператор объединения, например

      <img src="${some_url ?? 'publicurl.jpg'}" />

Или обычная тройка

      <img src="${some_url !== undefined ? some_url : 'public.jpg'}" />

Answer 3

Я нашел это решение для моего случая

`<input class="range-slider__slider" type="range" ${ ( (inputType) => {
                  if(inputType == 'temperature')
                    return 'min="-10" max="30" value="23" data-type="' + inputType +'"';
                  else if(inputType == 'light')
                    return 'min="0" max="1000" value="300" data-type="' + inputType +'"';
                  else if(inputType == 'floor')
                    return 'input(type="range" min="0" max="30" value="23" data-type="' + inputType + '"';
                  else
                    return ''
                } )(inputType)}">`