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

Впервые столкнулся с проблемой передачи по значению/ссылке в JS. Использую хук useState. И обнаружил что переменные, созданные с помощью такого хука, передаются в другие по ссылке. Да не просто по ссылке, а их ещё и дополнять можно.

const [time, setTime] = useState(0);
...
setTime(Date.now()); // времени между этими операциями достаточно
...
let currentTime = time + 1; // да, const тоже пробовал
setTime(0)                  // эта строчка уже в результате отчаяных эксперементов появилась
console.log(
  `cur time: ${currentTime}`,
  `   time: ${time}`,
  "\n\n"
);

А потом в консоль мне выдают:

cur time: 0
    time: 1     // вот тут я ожидаю что-то вроде 1602005420

Вопрос: как я могу отдать в currentTime текущее значение и дальше работать с time, не меняя значени currentTime?

P.S. Что я уже пробовал:

  • let time вместо [time, setTime] - работает, но разве нет способов с хуками?
  • const time - результат такой же
  • ещё одна промежуточная переменная const _time = currentTime - меняются обе без моего вмешательства

P.P.S. Я знаю, что объекты в JS передаются по ссылке, но, простите, я вывожу в консоль тип данных time и получаю Number.


Ответы (1 шт):

Автор решения: vp_arth

useState — фича для компонентов-функций, для ререндера функция всегда вызывается заново.

Предположу, что у вас let currentState определён внутри функции-компонента.

function Time() {
    const [time, setTime] = useState(0)

    let currentTime = 0;

    const setCurrentTime = () => {
      currentTime = time;
    }
    // ...
    return <> </
}

Если currentTime в области видимости функции, она уничтожается и создаётся новая.

Решение, хранить состояние вне скоупа функции(во внешней переменной, в сервисе, в redux store, в другом useState, где угодно снаружи):

let currentTime = 0;
function Time() {
    const [time, setTime] = useState(0)
    const setCurrentTime = () => {
      currentTime = time;
    }
    // ...
    return <> </
}
→ Ссылка