API композиции vue3 - смотреть

Я пытаюсь разобраться с API композиции. Проблемы с часами:

const totalValuation = ref(0);
const values = ref([1, 2, 3]);
totalValuation.value = watch(finalTasksFiltered.value, () => {
  return values.value.reduce((prev, curr) => {
  console.log(prev + curr);
  return prev + curr;
  }, 0);
});
  
return {
  finalTasksFiltered,
  totalValuation,
};

Console.log работает точно так же, как и должно (1,3,6), но я не могу отобразить его в DOM. Когда я проверяю консоль, все в порядке, но в DOM вроде {{totalValuation}} возвращается:

() => { (0,_vue_reactivity__WEBPACK_IMPORTED_MODULE_0__.stop)(runner); if (instance) { (0,_vue_shared__WEBPACK_IMPORTED_MODULE_1__.remove)(instance.effects, runner); } }

О, я использую Quasar - не уверен, что это имеет значение.

Я уверен, что это что-то маленькое.

Я импортировал реф и часы из vue. У меня тоже нормально работает вычисляемая функция.


vuejs3 quasar-framework vue-composition-api
person Wayne    schedule 05.07.2021    source источник

Ответы (1)


arrow_upward
0
arrow_downward

watch предназначен для выполнения функции при изменении некоторого значения. Он не предназначен для использования в качестве реф. То, что вы хотите сделать, похоже, больше подходит для computed

часы: (без назначения)

watch(finalTasksFiltered.value, () => {
  totalValuation.value = values.value.reduce((prev, curr) => {
  console.log(prev + curr);
  return prev + curr;
  }, 0);
});

вычислено: (использует присваивание)

const totalValuation = computed(() => {
  return values.value.reduce((prev, curr) => {
    console.log(prev + curr);
    return prev + curr;
  }, 0);
});
person Daniel    schedule 05.07.2021
comment
Привет спасибо. Computed дает мне результат 0 [объект Object]. Консоль дает мне такой же результат. Похоже, это улучшение, но не решение. - person Wayne; 05.07.2021
comment
Я получаю следующее предупреждение: [Нарушение] Принудительная перекомпоновка при выполнении JavaScript заняла 32 мс. - person Wayne; 05.07.2021
comment
похоже, здесь может происходить что-то еще. этот код должен работать сам по себе. ошибка принудительной перекомпоновки звучит так, как будто что-то застряло в цикле - person Daniel; 05.07.2021