suchen

Heim  >  Fragen und Antworten  >  Hauptteil

Pinia InternalError: Zu viele Rekursionsfehler bei der Verwendung von q-list in Quasar

<p>Bei der Verwendung von Pinia Store in meiner Quasar-Komponente ist dieser Fehler <code>InternalError: Too much recursion</code> aufgetreten und ich habe alles getan, was ich weiß, aber keine Lösung gefunden. </p><p> Kann ich mich hier beraten lassen? </p> <p>Dies ist meine <code>IndexPage.vue</code>, wo ich die QList-Komponente aufrufe: </p> <pre class="brush:php;toolbar:false;"><template> <q-page> <div class="q-pa-md" style="max-width: 350px"> <QList /> </div> </q-page> </template> <script> QList aus 'src/components/QList.vue' importieren; Standard exportieren { Komponenten: { QList } } </script></pre> <p>Dies ist meine <code>QList.vue</code> <pre class="brush:php;toolbar:false;"><template> <div v-if="loading">Carregando...</div> <q-list v-else umrandetes Trennzeichen> <q-item v-for="item in testData" :key="item.id" anklickbares V-Ripple> <q-item-section>{{ item.title }}</q-item-section> </q-item> </q-list> </template> <script> importiere { testeStore } aus '../stores/teste' import { defineComponent, berechnet, onMounted } from 'vue'; Standard exportieren defineComponent({ aufstellen () { const store = testeStore(); onMounted(() => { store.loadData(); }); const testData = berechnet(() => store.getData()); const Loading = berechnet(() => store.$state.loading); zurückkehren { Testdaten, Wird geladen } } }) </script></pre> <p>还有我的 <code>testeStore.js</code> 商JI:</p> <pre class="brush:php;toolbar:false;">import { defineStore } from 'pinia' testeData aus „../assets/data/testes.json“ importieren export const testeStore = defineStore({ id: 'teste', Zustand: () => ({ Daten: [], Laden: falsch, }), Getter: { getData: state => state.data, }, Aktionen: { lade Daten () { versuchen { this.loading = true this.data = testeData; } Catch (Fehler) { console.log(`Fehler beim Abrufen der Tests: ${{ error }}`) } Endlich { this.loading = false } } } })</pre> <p>这是来自控制台的一段 vue warn:</p> <pre class="brush:php;toolbar:false;">[Vue warn]: Unbehandelter Fehler während der Ausführung des Scheduler-Flushes. Dies ist wahrscheinlich ein interner Fehler von Vue. Bitte öffnen Sie ein Problem unter https://new-issue.vuejs.org/?repo=vuejs/core at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" > at <QList key=1 bordered="" Separator="" ></pre></p>
P粉262073176P粉262073176458 Tage vor420

Antworte allen(1)Ich werde antworten

  • P粉547170972

    P粉5471709722023-09-02 18:21:58

    刚刚检查了 stackblitz,看起来您自己的 QList 组件和 Quasar 的内置“q-list”组件之间存在命名冲突。 Vue 对待组件名称不区分大小写,这就是为什么它将“q-list”和“QList”解释为同一个组件。

    要解决此问题,您可以尝试将自己的 QList 组件重命名为与 Quasar 组件不冲突的其他名称,例如“MyQList”,或者使用别名导入 Quasar“q-list”组件。

    从 'quasar' 导入 { Qlist as QuasarList }

    Antwort
    0
  • StornierenAntwort