Как можно изменить значение переменной во время выполнения кода в React?

Как можно обновить значения переменных useState внутри функции handleClick, чтобы новые значения отобразились в консоли? В данном коде значения name и age не обновляются при вызове handleClick. Я уже прошерстил интернет в поисках решения, но так и не нашел ответа. :(
  • 7 ноября 2023 г. 3:09
Ответы на вопрос 1
В React, для изменения значения переменной во время выполнения кода, можно использовать хуки состояния (state).

В примере кода, который вы привели, есть некоторые проблемы.
1. Необходимо импортировать хук `useState` из библиотеки React.
2. Вызов `useState()` возвращает кортеж из двух элементов: значения состояния и функции для его обновления. Поэтому при объявлении переменных `name` и `age` нужно их распаковать из этого кортежа.

Вот исправленный код:

```javascript
import React, { useState } from 'react';

function App() {
  const [name, setName] = useState('John');
  const [age, setAge] = useState(25);

  const handleClick = () => {
    setName('Alice');
    setAge(30);
  };

  console.log(name, age);

  return (
    <button onClick={handleClick}>Click me</button>
  );
}

export default App;
```

Теперь при каждом клике на кнопку значения `name` и `age` будут обновляться, и они будут отображены в консоли.
Похожие вопросы