vue.js Nuxt -无法在watch()回调内调用useContext()

wwwo4jvm 于 2023-01-14 发布在 Vue.js

关注(0)|答案(2)|浏览(280)

我使用的是@nuxtjs/composition-api版本0.33.1和Nuxt 2，我的组件如下所示：

import { defineComponent, useContext, useRoute, watch } from '@nuxtjs/composition-api';

export default defineComponent({
  setup () {
    const route = useRoute();

    // Other code...

    watch(() => route.value.query, () => {
      const { $axios } = useContext();
    });

    // Other code...
  }
});

正如您所看到的，当route.value.query发生变化时，我试图执行一些操作，但是，这会给我带来错误：

Error: This must be called within a setup function.
    at useContext (index.mjs?9a99:220:1)
    at eval (search.vue?9447:34:1)
    at invokeWithErrorHandling (vue.common.dev.js?4650:3634:1)
    at call (vue.common.dev.js?4650:3271:1)
    at watcher.run (vue.common.dev.js?4650:3375:1)
    at flushSchedulerQueue (vue.common.dev.js?4650:3140:1)
    at Array.eval (vue.common.dev.js?4650:3760:1)
    at flushCallbacks (vue.common.dev.js?4650:3682:1)

我错过了什么吗？我怎么能在watch()的回调函数中调用useContext()？还是根本不可能？

vue.js

来源：https://stackoverflow.com/questions/75076114/nuxt-cannot-call-usecontext-inside-watch-callback

2条答案

按热度按时间

bweufnob1#

我在github中找到了这个答案。解决方案建议添加最新版本的nuxt组合API。

赞(0）回复(0）举报 2023-01-14

uemypmqf2#

由于包的开发人员将confirmed设置为useContext()，因此监视器回调中不可能包含useContext()。
解决方法是首先调用useContext()，然后在回调中使用其返回值。

import { defineComponent, useContext, useRoute, watch } from '@nuxtjs/composition-api';
export default defineComponent({
  setup () {
    const route = useRoute();
    // Other code...

    const { $axios } = useContext();
    watch(() => route.value.query, () => {
      // use $axios here
    });
    // Other code...
  }
});

赞(0）回复(0）举报 2023-01-14

我来回答

vue.js Nuxt -无法在watch()回调内调用useContext()

2条答案

相关问题

热门标签

最新问答