分类导航

程序问答发布时间：2022-06-02 发布网站：大佬教程 code.js-code.com

大佬教程收集整理的这篇文章主要介绍了离子 Vue 幻灯片错误？我错过了什么？，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

如何解决离子 Vue 幻灯片错误？我错过了什么？？

开发过程中遇到离子 Vue 幻灯片错误？我错过了什么？的问题如何解决？下面主要结合日常开发的经验，给出你关于离子 Vue 幻灯片错误？我错过了什么？的解决方法建议，希望对你解决离子 Vue 幻灯片错误？我错过了什么？有所启发或帮助；

我在使用 Ionic SlIDes 时遇到问题。在更新幻灯片内容之前，一切都按预期工作。我在这里做错了吗？这是我重现问题的代码：

<template>
  <ion-content>
    <ion-button @click="updateSlIDes()">update SlIDes</ion-button>
    <ion-slIDes pager="true" :options="slIDeOpts">
      <ion-slIDe 
          v-for="slIDe in slIDes"
          :key="slIDe.ID">
              <h1> {{ slIDe.ID }} | {{ slIDe.text }} </h1>
      </ion-slIDe>
    </ion-slIDes>
  </ion-content>  
</template>


<script>
import { IonSlIDes,IonSlIDe,IonContent,Ionbutton } from '@ionic/vue';
import { defineComponent } from 'vue';

export default defineComponent({
  components: { IonSlIDes,Ionbutton },data() {
        return {
            slIDes: [
              { ID: 1,text: "first slIDe" },{ ID: 2,text: "second slIDe" },{ ID: 3,text: "third slIDe" },]
            
        }
    },methods: {
    updateSlIDes () {
      this.slIDes = [
              { ID: 4,text: "new slIDe" },{ ID: 5,{ ID: 6,]
    }
  },setup() {
    // Optional parameters to pass to the swiper instance. See http://IDangero.us/swiper/API/ for valID options.
    const slIDeOpts = {
      initialSlIDe: 1,speed: 400
    };
    return { slIDeOpts }
  }
});
</script>

这里是错误：

runtime-core.esm-bundler.Js?5c40:38 [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/vue-next 
  at <Anonymous key=6 > 
  at <Anonymous pager="true" options= {initialSlIDe: 1,speed: 400} > 
  at <IonContent isInOutlet=true registerIonPage=fn<registerIonPage> > 
  at <Home ref=Ref< Proxy {updateSlIDes: ƒ, …} > key="/home" isInOutlet=true  ... > 
  at <IonRouterOutlet> 
  at <IonApp> 
  at <App>

Uncaught (in promisE) DOMException: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.
    at insert (webpack-internal:///./node_modules/@vue/runtime-dom/dist/runtime-dom.esm-bundler.Js:242:16)
    at mountElement (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.Js:4944:9)
    at procesSELER_13_11845@ent (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.Js:4885:13)
    at patch (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.Js:4793:21)
    at componentEffect (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.Js:5330:21)
    at reactiveEffect (webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.Js:71:24)
    at effect (webpack-internal:///./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.Js:46:9)
    at setupRenderEffect (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.Js:5276:89)
    at mountComponent (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.Js:5235:9)
    at processComponent (webpack-internal:///./node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.Js:5193:17)