Я спрашиваю, потому что у меня есть консольный журнал в основной функции компонента, и каждый раз, когда я меняю состояние, когда консоль выполняется.
import React, { useState, useEffect } from 'react';
import './App.css';
function App() {
const [bgPostColor, setBgPostColor] = useState(undefined);
const numbers = [1,2,3,,4,5];
const changeBgColorPost = number => {
switch (number)
{ case 2: setBgPostColor("blue"); break;
case 3: setBgPostColor("green"); break;
case 4: setBgPostColor("yellow"); break;
case 5: setBgPostColor("red"); break;
default: setBgPostColor("white"); break;
}
}
const listItems = numbers.map( number =>
<span key={number}>
<label
className={"radioLabel radio-"+number} htmlFor={"radio-"+number} onClick={ () => changeBgColorPost(number) }>
</label>
<input name="category" style={{ display: 'none' }} type="radio" id={"radio-"+number}/>
</span>
)
console.log("posts")
return (
<div>
<div className="categories">
{listItems}
</div>
<textarea placeholder="Escribe aqui pues, ramon" name="" id="" style={{ background: `${bgPostColor}` }}></textarea>
</div>
)
}
export default App;
там добавляется код.
Также к этому компоненту у меня есть запрос через axios, чтобы получить список постов, и я выполняю его в рамках «useEffect», но я не считаю важным размещать его здесь
.Из-за sГ - функциональные компоненты становятся отвечающими современным требованиям каждый раз, когда Ваш отец - renderizado или получает новые props. Представь, что все тело ее funciГіn - render составляющий класс. Сейчас, когда у нас есть state в этих компонентах tambiГ©n provocarГЎn renderizado, asГ - что ты должен быть осторожен с Hooks особенно с твоей договоренностью зависимости, этим ayudarГЎ, которому одинокий Hook работал однажды ([]) или каждый раз, когда prop или state cambiГ© ([prop, state]), и не всегда с каждым renderizado, который aveces вызывает плохой результат. Тогда, если, renderiza каждый раз, когда state меняется. Я надеюсь, что он помогает.