Реагируйте, поместите html в jsx внутри if-ese

Question

Я хочу сделать это в рендере:

return(
  <NavbarGroup>
    {user.demo ? '<span className="demo-top-title">Demo User</span>' : ''}
  </NavbarGroup>
etc...

Но я получаю тот же код, что и текст, а не HTML.Я не знаю, как использовать dangerouslySetInnerHTML в этой ситуации

Answer 1

Просто для полноты вы можете использовать && короткое замыкание:

return (
  <NavbarGroup>
    {user.demo && <span className="demo-top-title">Demo User</span>}
  </NavbarGroup>
)

Answer 2

return(
  <NavbarGroup>
    {user.demo ? <span className="demo-top-title">Demo User</span> : ''}
  </NavbarGroup>
etc...

Используйте вот так.