在与 VOverlay 相关的所有 vuetify 3 组件中获取 vue-warn（v-dialog、v-tooltip、v-overlay）答案

【问题标题】：Getting vue-warn in all the vuetify 3 components related to VOverlay (v-dialog, v-tooltip, v-overlay)在与 VOverlay 相关的所有 vuetify 3 组件中获取 vue-warn（v-dialog、v-tooltip、v-overlay）
【发布时间】：2023-01-20 15:23:25
【问题描述】：

我正在使用 Vue 3 和 Vuetify 3.0.1。我想开发一个基于 Options API 的 Vue 应用程序。在尝试使用简单的 v-dialog 时，出现以下错误：

    runtime-core.esm-bundler.js?d2dd:40 [Vue warn]: Unhandled error during execution of watcher callback 
  at <VOverlay ref=Ref< undefined > class="v-dialog" width="500"  ... > 
  at <VDialog modelValue=false onUpdate:modelValue=fn width="500" > 
  at <VMain> 
  at <VApp> 
  at <App>
warn @ runtime-core.esm-bundler.js?d2dd:40
runtime-core.esm-bundler.js?d2dd:40 [Vue warn]: Unhandled error during execution of setup function 
  at <VOverlay ref=Ref< undefined > class="v-dialog" width="500"  ... > 
  at <VDialog modelValue=false onUpdate:modelValue=fn width="500" > 
  at <VMain> 
  at <VApp> 
  at <App>


Uncaught TypeError: globalStack.at is not a function
    at eval (webpack-internal:///./node_modules/vuetify/lib/composables/stack.mjs:36)
    at callWithErrorHandling (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:286)
    at callWithAsyncErrorHandling (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:295)
    at ReactiveEffect.getter [as fn] (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:1858)
    at ReactiveEffect.run (webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js:225)
    at doWatch (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:1973)
    at watchEffect (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js:1778)
    at useStack (webpack-internal:///./node_modules/vuetify/lib/composables/stack.mjs:34)
    at Object.setup [as _setup] (webpack-internal:///./node_modules/vuetify/lib/components/VOverlay/VOverlay.mjs:151)
    at setup (webpack-internal:///./node_modules/vuetify/lib/util/defineComponent.mjs:62)

我的设置配置并不复杂。

App.Vue

<template>
  <v-app>
    <v-dialog v-model="dialog">
      <template v-slot:activator="{ props }">
        <v-btn color="primary" v-bind="props"> Open Dialog </v-btn>
      </template>
    </v-dialog>
  </v-app>
</template>

<script lang="ts">
export default {
  name: "App",
  data() {
    return {
      dialog: false,
    };
  },
};
</script>

主.ts

import { createApp } from "vue";
import store from "./store/planner";
import vuetify from "./plugins/vuetify";
import App from "./App.vue";
import router from "./router";
import i18n from "./i18n";

const app = createApp(App);
app.use(vuetify).use(router).use(store).use(i18n);
app.mount("#app");

这发生在所有涉及 v-overlay 的 vuetify 组件上。

【问题讨论】：

可能是 Vuetify 3 中的错误。尝试通过调用堆栈进行调查，并最终在 Vuetify 代码中放置断点，以查看到底是什么导致了问题。

标签： vue.js vuetify.js vue-cli

【解决方案1】：

我有类似的错误警告。我尝试从 webview android 查看页面时得到，但在浏览器上查看时没有错误。你已经得到这个错误的答案了吗？

【讨论】：