Почему в консоли всегда выводится true для isPending.value, хотя в объекте Proxy оно равно false? Как можно исправить эту проблему?
Значение переменной .value в Nuxt 3 отображается иначе в консоли из-за использования Proxy для обертывания объектов reactive. Когда вы обращаетесь к значению переменной со свойством .value в консоли, вы видите актуальное значение переменной, так как Proxy автоматически возвращает актуальное значение при прямом обращении к нему. При этом, в объекте Proxy значение переменной может быть изменено, но при выводе в консоль может не обновиться сразу, поэтому вы видите false в Proxy, а true при выводе в консоль. Чтобы исправить эту проблему и увидеть актуальное значение переменной в консоли, вы можете использовать функцию .valueOf() при выводе значения. Например: ```javascript console.log(isPending.value.valueOf()); ``` Таким образом, вы получите актуальное значение переменной, а не значение объекта Proxy.
Во первых: всё зависит от сигнатуры этого вашегоuseApiFetch
, очень многое в vue 3 можно сломать неудачной деструктуризацией. Но допустим сам хук нормальный.
В таком случаеisPending
- этоref
, а значит он и должен быть прокси, чтоб собственно работала энтая самая реактивность. Чтоб отобразить в консоли чистый объект - есть хэлперtoRaw
(только после этого он уже не будет динамическим).
Далее: если вы выводите в консольisPending.value
- то в консоль, очевидно, попадает значение на момент вызоваconsole.log
. Магическим образом прямо в консоли оно уже не изменится.
Если ты хочешь понаблюдать за изменениямиisPending
- можешь сделать так:
watch(isPending, (value) => console.log('watch isPending', value), { immediate: true });
В заключение предположу, что всё у вас работает как должно, а проблемы с пониманием реактивности vue и асинхронности как таковой.