Pinia InternalError:在 Quasar 中使用 q-list 時出現太多遞歸錯誤
<p>在我的 Quasar 組件中使用 Pinia Store 時,我遇到了這個錯誤 <code>InternalError: Too much recursion</code>,我已經做了我所知道的一切但沒有解決。 </p><p>
我可以在這裡得到建議嗎? </p>
<p>這是我的 <code>IndexPage.vue</code>,我在其中呼叫 QList 元件:</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>
import QList from 'src/components/QList.vue';
export default {
components: {
QList
}
}
</script></pre>
<p>這是我的 <code>QList.vue</code> 組件:</p>
<pre class="brush:php;toolbar:false;"><template>
<div v-if="loading">Carregando...</div>
<q-item v-for=“測試資料中的項目” :key="item.id";可點擊的V型波紋>
{{ item.title }};
</q-item>
</q-列表>
</範本>
<腳本>
從 '../stores/teste' 導入 { testeStore }
從“vue”導入{defineComponent,計算,onMounted};
導出預設定義組件({
設定 () {
const store = testeStore();
onMounted(() => {
store.loadData();
});
const testData = 計算(() => store.getData());
const 載入 = 計算(() => store.$state.loading);
返回 {
測試數據,
載入中
}
}
})
</劇本></pre>
<p>還有我的 <code>testeStore.js</code>店:</p>
<pre class="brush:php;toolbar:false;">從 'pinia' 匯入 { DefineStore }
從 '../assets/data/testes.json' 導入 testeData
導出 const testeStore = DefineStore({
id: '測試',
狀態:() => ({
數據: [],
加載:假,
}),
吸氣劑:{
取得資料:狀態=>狀態.數據,
},
行動:{
載入資料(){
嘗試 {
this.loading = true
this.data = testeData;
} 捕獲(錯誤){
console.log(`取得睪丸時發生錯誤:${{ error }}`)
} 最後 {
this.loading = false
}
}
}
})</pre>
<p>每個組件看起來都很正常,我真的不知道我的問題出在哪裡。這是來自控制台的一段vue warn:</p>
[Vue warn]:執行調度程式刷新期間出現未處理的錯誤。這可能是 Vue 內部錯誤。請在 https://new-issue.vuejs.org/?repo=vuejs/core 提出問題
在
在
在
在
在
在
在
在
在
在
在
在
在
在
在
在
在
在
在
在
在
全部回覆(1)我來回復
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 }
回覆
0 取消回覆