Кто-нибудь может объяснить этот способ одновременного включения двух классов в javascript

#reactjs

#reactjs

Вопрос:

 label ? (<label className={`${otherProps.value.length ? 'shrink' : ''} form-input-label`}>
{label}
</label>) : null
 

Я не понимаю, как применяется класс

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

1. Это просто строка литерала шаблона ( developer.mozilla.org/en-US/docs/Web/JavaScript/Reference /… ), внутри которого есть троичный оператор, который определяет, следует ли не добавлять класс «shrink» ( developer.mozilla.org/en-US/docs/Web/JavaScript/Reference /… )

Ответ №1:

className Будет

  • 'shrink form-input-label' если otherProps.value.length значение равно истинному значению (возможно otherProps.value , это не пустая строка или массив)
  • ' form-input-label' если otherProps.value.length значение false ( otherProps.value пустая строка или массив)

Ответ №2:

 >  label amp;amp; (<label className={`${otherprops.value.length} ? 'shrink' :
> 'form-input-label'`}>{label}</label>)
 

Исходя из заданного вами вопроса, если значение label равно true
, тогда оно проверяет внутри значение имени класса и будет
‘shrink’ в случае true , в противном случае имя класса будет
‘form-input-label в случае false. И если метка false , то
вернет null. Вы можете обновить свой код, как указано выше, что я
упомянул для удобства, он напрямую проверяет только истинный случай!! Надеюсь
, что это прояснит!

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

1. Ответ подразумевает более подробное объяснение того, что делают эти строки кода. Пожалуйста, в ближайшем будущем постарайтесь избегать публикации просто кода без каких-либо пояснений.