0

У меня есть элемент <p>{percent_change_24h}</p>, и нужно построить условие, если переменная percent_change_24h больше 0, то цвет - зелёный, а если меньше 0 - то красный. Как это можно реализовать через условный рендеринг или функцию? Не разобрался.

Подскажите, пожалуйста! Буду благодарен!

1 ответ 1

0

если переменная percent_change_24h больше 0, то цвет - зелёный, а если меньше 0 - то красный

Такое реализовать можно вот таким образом...

//
function App() {
  const percent_change_24h = -10
  const s = {}
  if (percent_change_24h > 0) s.color = 'green'
  if (percent_change_24h < 0) s.color = 'red'
  return <p style={s}>{percent_change_24h}</p>
}

const domContainer = document.querySelector('#like_button_container');
const root = ReactDOM.createRoot(domContainer);
root.render(<App />);
<script src="https://unpkg.com/react@18/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@18/umd/react-dom.development.js" crossorigin></script>
<div id="like_button_container"></div>

1
  • Cпасибо большое!
    – Michael
    Commented 2 июл. 2023 в 16:04

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.