Nuxt，VueJS必须在安装函数中调用

Question

我有个项目。它目前可以在一个特定的网站上使用。我需要进行一些修改。当我从gitlab下载一个项目并运行它时，它会抛出一个错误：，这必须在安装函数.中调用。

路径：..nuxt/组合-api/index.js

const useContext = () => {
  const vm = CompositionApi.getCurrentInstance();
  if (!vm)
    throw new Error("This must be called within a setup function.");
  return {
    ...(vm[globalNuxt] || vm.$options).context,
    route: CompositionApi.computed(() => vm.$route),
    query: CompositionApi.computed(() => vm.$route.query),

怎么啦？

我需要运行该项目来进行一些更改，但无法将其部署到本地服务器上。

更新: useContex在default.vue中

...
setup (_, { isServer, refs }: any) {
    // console.info(context)
    // const refs = context.refs
    const { store } = useContext()
    const { scrolllock } = scrollLock(store)
    const locationName = computed(() => store.getters.locationName)
    const location = computed({
      set (val: boolean) {
        store.dispatch('setLocationModal', val)
      },
      get () {
        return store.getters.locationModal
      }
    })
...

当我试图访问站点时，的cmd输出

[Vue warn]: [vue-composition-api] already installed. Vue.use(VueCompositionAPI) should be called only once.


 ERROR  [Vue warn]: Error in data(): "Error: This must be called within a setup function."                    22:50:04

found in

---> <Layouts/default.vue> at layouts/default.vue
       <Root>


 ERROR  [Vue warn]: Error in data(): "Error: This must be called within a setup function."                    22:50:05

found in

---> <Layouts/default.vue> at layouts/default.vue
       <Root>


 ERROR  [Vue warn]: Error in data(): "Error: This must be called within a setup function."                    22:50:24

found in

---> <Layouts/default.vue> at layouts/default.vue
       <Root>

Answer 1

根据我的经验，npm不能安装@nuxtjs/composition-api旧版本或类似的东西，所以我卸载了它的旧版本并安装了新版本，而且它已经工作了

以下是我所做的

rm -rf node_modules && rm -rf package-lock.json && npm uninstall @nuxtjs/composition-api && npm i @nuxtjs/composition-api && npm i

Answer 2

从事物的角度看，你似乎

在已经安装了@nuxtjs/composition-api时，您为VueCompositionAPI创建了另一个插件

我建议您从项目中删除任何其他组合-api，并坚持使用最新版本的官方@nuxtjs/composition-api和Vuex v4 for Nuxt 2。

在最新版本的@nuxtjs/composition-api中，您可以使用

const store = useStore();
// OR
const { store } = useContext();

注意:为了避免const router = useStore()错误，您必须直接在setup()函数中定义助手函数，而不是在方法中定义This must be called within a setup function。

对于那些想使用route的人

为了顺利升级到Nuxt 3，建议使用

，而不是从useContext访问route、query、from和params，而是使用useRoute助手函数。

Answer 3

我不知道那里发生了什么。我删除了那个存储库，并再次克隆了它。接下来，我做了这样的工作：npm init，然后是npm run dev，它起作用了。