Conversation
|
|
||
| Жизненные этапы и циклы React-компонента | ||
|
|
||
| <img src="./images/react-lifecycle.jpg" title="react lifecicles" /> |
There was a problem hiding this comment.
без знания о классовых компонентах эта картинка вроде не много говорит
может такое? (или просто добавить)
|
|
||
| <!-- v --> | ||
|
|
||
| [useState](https://react.dev/reference/react/useState) - это хук React, который позволяет добавить переменную состояния в компонент. |
There was a problem hiding this comment.
в старой документации есть описание на русском https://ru.legacy.reactjs.org/docs/hooks-effect.html
|
|
||
| <!-- v --> | ||
|
|
||
| [useState](https://react.dev/reference/react/useState) - это хук React, который позволяет добавить переменную состояния в компонент. |
There was a problem hiding this comment.
в старой документации есть описание на русском https://ru.legacy.reactjs.org/docs/hooks-effect.html
|
|
||
| - **Текущее состояние** (state). Во время первого рендера оно будет соответствовать переданному вами **initialState**. | ||
|
|
||
| - **Функция set** (setState), которая позволяет обновить состояние до другого значения и вызвать повторный рендеринг. |
There was a problem hiding this comment.
прошу обратить внимание что нейминг произвольный, и что есть соглашение об именовании
There was a problem hiding this comment.
нейминг взят отсюда
https://react.dev/reference/react/useState
|
|
||
| return ( | ||
| <> | ||
| <input value={text} onChange={handleChange} /> |
There was a problem hiding this comment.
тут полезно проговорить про разницу реактовского onChange и нативного события change
| return ( | ||
| <> | ||
| <input value={name} onChange={(e) => setName(e.target.value)} /> | ||
| <button onClick={() => setAge(age + 1)}>Increment age</button> |
There was a problem hiding this comment.
я дальше не смотрел, но на всякий случай - проговорить тут студентам, что так писать не нужно, а нужна сигнатура с мутацией.setAge(age => age + 1)
| const [user, setUser] = useState(null); | ||
| const [isLoading, setIsLoading] = useState(false); | ||
|
|
||
| useEffect(() => { |
There was a problem hiding this comment.
проговорить почему тут нельзя async использовать https://devtrium.com/posts/async-functions-useeffect
2 participants
No description provided.