Как отследить два состояния одновременно?

В React есть несколько способов отслеживать два состояния одновременно. Один из самых распространенных способов - использовать хук useState для создания нескольких переменных состояния.

Для начала, вы можете импортировать хук useState из библиотеки React:

import React, { useState } from 'react';

Затем вы можете использовать хук useState для создания двух переменных состояния и их значений:

const [state1, setState1] = useState(initialState1);
const [state2, setState2] = useState(initialState2);

Здесь "state1" и "state2" - это переменные состояния, а "setState1" и "setState2" - это функции, которые позволяют изменить значения этих состояний. "initialState1" и "initialState2" - это начальные значения для этих состояний.

Теперь, если вам нужно отслеживать изменения обоих состояний одновременно, вы можете использовать эти переменные состояния в вашем компоненте и выполнять необходимые действия при их изменении:

useEffect(() => {
  // код, выполняемый при изменении state1 или state2
}, [state1, state2]);

В данном случае, useEffect - это хук, который выполняет указанный код при каждом изменении state1 или state2. Массив [state1, state2] во втором аргументе useEffect указывает, на какие переменные состояния нужно следить.

Вы также можете использовать условные операторы или другие логические операторы для выполнения разных действий на основе значений обоих состояний:

if (state1 && state2) {
  // код, выполняемый, если оба состояния имеют значение true
} else if (state1 || state2) {
  // код, выполняемый, если хотя бы одно состояние имеет значение true
} else {
  // код, выполняемый, если оба состояния имеют значение false
}

Также, если вы хотите выполнить действие после обновления обоих состояний, вы можете использовать useEffect с зависимостью только от одного из состояний:

useEffect(() => {
  // код, который будет выполнен после обновления обоих состояний
}, [state1]);

Это позволит выполнить код внутри useEffect после обновления state1, при этом обновление state2 не будет вызывать повторное выполнение кода.