国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

<p>What I tried was vue-toastification using a custom component and some Vuetify components in toast. I created the repository using <code>npm create vuetify@latest</code> and installed the library <code>npm i vue-toastification@latest</code>. Then used the plug-in: </p> <pre class="lang-js prettyprint-override"><code>// main.ts //Toastification import Toast, { POSITION } from "vue-toastification"; import "vue-toastification/dist/index.css"; const app = createApp(App); const options = { shareAppContext: true, // From https://github.com/Maronato/vue-toastification#access-global-components-and-plugins-inside-toasts position: POSITION.BOTTOM_CENTER, }; registerPlugins(app); app.use(Toast, options); </code></pre> <p>Then I tried calling toast using the following code: </p> <pre class="lang-js prettyprint-override"><code>// store/error.ts import { useToast } from "vue-toastification"; import MyComponent from "@/components/MyComponent.vue"; const toast = useToast(); export const useErrorStore = defineStore("error", () => { function locationError() { toast(MyComponent); } }); </code></pre> <p>In my component: </p> <pre class="lang-js prettyprint-override"><code>// components/MyComponent.vue <template> <div class="container"> <v-container> <v-row> <v-col> Alert example </v-col> <v-col> <v-btn @click="reload">Reload</v-btn> </v-col> </v-row> </v-container> </div> </template> <script setup lang="ts"> function reload() { if (typeof window !== "undefined") { window.location.reload(); } } </script> </code></pre> <p>I call it from the App.vue file: </p> <pre class="lang-js prettyprint-override"><code>// App.vue <template> <v-app> <v-main> <v-btn @click="loc">Location Error</v-btn> </v-main> </v-app> </template> <script setup lang="ts"> import { useErrorStore } from "./store/error"; const errorStore = useErrorStore(); function loc() { errorStore.locationError(); } </script> </code></pre> <p>But at runtime, when I click the button, I get the following error: </p> <pre class="brush:php;toolbar:false;">[Vue warn]: injection "Symbol(vuetify:defaults)" not found. at <VContainer> at <MyComponent key=1 toast-id=0 onCloseToast=fn<bound closeToast> > at <VtToast key="_default00" position="bottom-center" draggable=true ... > at <TransitionGroup tag="div" enter-active-class="Vue-Toastification__bounce-enter-active" move-class="Vue-Toastification__bounce-move" ... > at <VtTransition transition="Vue-Toastification__bounce" class="Vue-Toastification__container bottom-center" > at <VueToastification eventBus= EventBus {allHandlers: {…}} shareAppContext= {_uid: 0, _component: {…}, _props: null, _container: div#app, _context: {…}, …} position="bottom -center" > [Vue warn]: Unhandled error during execution of setup function at <VContainer> at <MyComponent key=1 toast-id=0 onCloseToast=fn<bound closeToast> > at <VtToast key="_default00" position="bottom-center" draggable=true ... > at <TransitionGroup tag="div" enter-active-class="Vue-Toastification__bounce-enter-active" move-class="Vue-Toastification__bounce-move" ... > at <VtTransition transition="Vue-Toastification__bounce" class="Vue-Toastification__container bottom-center" > at <VueToastification eventBus= EventBus {allHandlers: {…}} shareAppContext= {_uid: 0, _component: {…}, _props: null, _container: div#app, _context: {…}, …}position="bottom-center" > [Vue warn]: Unhandled error during execution of scheduler flush. This is likely a Vue internals bug. Please open an issue at https://new-issue.vuejs.org/?repo=vuejs/core at <VContainer> at <MyComponent key=1 toast-id=0 onCloseToast=fn<bound closeToast> > at <VtToast key="_default00" position="bottom-center" draggable=true ... > at <TransitionGroup tag="div" enter-active-class="Vue-Toastification__bounce-enter-active" move-class="Vue-Toastification__bounce-move" ... > at <VtTransition transition="Vue-Toastification__bounce" class="Vue-Toastification__container bottom-center" > at <VueToastification eventBus= EventBus?{allHandlers: {…}} shareAppContext= {_uid: 0, _component: {…}, _props: null, _container: div#app, _context: {…},?…} position="bottom-center" > Uncaught (in promise) Error: [Vuetify] Could not find defaults instance at injectDefaults (defaults.ts:28:24) at setup (defineComponent.tsx:118:24) at callWithErrorHandling (runtime-core.esm-bundler.js:158:18) at setupStatefulComponent (runtime-core.esm-bundler.js:7236:25) at setupComponent (runtime-core.esm-bundler.js:7197:36) at mountComponent (runtime-core.esm-bundler.js:5599:7) at processComponent (runtime-core.esm-bundler.js:5565:9) at patch (runtime-core.esm-bundler.js:5040:11) at mountChildren (runtime-core.esm-bundler.js:5284:7) at mountElement (runtime-core.esm-bundler.js:5191:7)</pre> <p>我錯(cuò)過(guò)了什么？在運(yùn)行時(shí)無(wú)法在動(dòng)態(tài)組件中使用Vuetify嗎？</p> <p>我在這里創(chuàng)建了一個(gè)示例倉(cāng)庫(kù)。</p>

import Toast from "vue-toastification";
import type { PluginOptions } from "vue-toastification";

const ToastOptions: PluginOptions = {
  shareAppContext: true,
  container: () => document.getElementById("app")!,
};

app.use(Toast, ToastOptions);