3

我正在使用@vue/composition-api和 usePromise 来自vue-composable。

我观察从承诺返回的计算值。承诺在 12000 毫秒后解决。

computed和第一次watch被调用，但在 12000 毫秒后它们都没有被调用。所以手表回调不起作用。甚至 api.result 也发生了变化。

我可以通过打印看到模板中的值发生了变化：{{items}}.

如何解决这种意外行为？值变化时如何调用手表回调？

这是输出：

 in computed
 in watch

预期的：

     in computed
     in watch
     in computed <-- data is resolved the api.result changed (has new value).
     in watch <--- same.

编码：

  setup() {

    function timeout(ms) {
      return new Promise((resolve) => setTimeout(resolve, ms));
    }

    const api = usePromise(() => Promise.all([timeout(12000).then(() => ({ some: 'data'}))]));

    const items = computed(() => {
      console.log('in computed');
      return api.result;
    });

    watch(items, (v) => {
      console.log('in watch');
    })

    api.exec();
    return { items }

这是作品：

  watch(api.result, (v) => {
    console.log('in watch api.result');
  })

但是为什么计算不起作用？如何让它重新计算，以便计算上的手表可以工作？

代码沙盒上的代码

4

0 回答 0