使用 Vue apollo 无限加载失败查询
Infinite loading on failed query with Vue apollo
我正在使用 Quasar 开发应用程序,它编译为 Cordova 应用程序,因此我可以 运行 在我的 phone 上使用它。奇怪的是,我只在我的 phone 上有这个错误,在控制台中没有错误,并且只在安装应用程序时的第一次加载时出现。
我有一个简单的查询
apollo: {
receipts: {
query: GET_RECEIPTS,
loadingKey: "loading",
},
},
我的组件数据是:
loading = 0;
@Watch("loading")
emitLoading(val) {
this.$apollo.mutate({
mutation: UPDATE_LOADING,
variables: { loading: !!val }
});
}
但问题是当查询无法获取任何内容(数据库中没有数据)时,我会无限加载。我应该用 apollo error hook 修复吗?如果是,我如何访问挂钩的加载数据?
解决方案一点也不明显。我需要更改该页面 (homeManagement) 的路由路径。以前我有:
path: "/",
component: () => import("layouts/main-layout.vue"),
meta: { requiresAuth: true },
children: [
{
path: "",
name: "homeManagement",
component: () => import("pages/home-management/index.vue")
}
现在我有:
path: "/",
component: () => import("layouts/main-layout.vue"),
meta: { requiresAuth: true },
children: [
{
path: "home",
name: "homeManagement",
component: () => import("pages/home-management/index.vue")
}
我不明白为什么会这样。顺便说一下,homeManagement 的 path: "/"
也给我带来了加载问题。
我正在使用 Quasar 开发应用程序,它编译为 Cordova 应用程序,因此我可以 运行 在我的 phone 上使用它。奇怪的是,我只在我的 phone 上有这个错误,在控制台中没有错误,并且只在安装应用程序时的第一次加载时出现。
我有一个简单的查询
apollo: {
receipts: {
query: GET_RECEIPTS,
loadingKey: "loading",
},
},
我的组件数据是:
loading = 0;
@Watch("loading")
emitLoading(val) {
this.$apollo.mutate({
mutation: UPDATE_LOADING,
variables: { loading: !!val }
});
}
但问题是当查询无法获取任何内容(数据库中没有数据)时,我会无限加载。我应该用 apollo error hook 修复吗?如果是,我如何访问挂钩的加载数据?
解决方案一点也不明显。我需要更改该页面 (homeManagement) 的路由路径。以前我有:
path: "/",
component: () => import("layouts/main-layout.vue"),
meta: { requiresAuth: true },
children: [
{
path: "",
name: "homeManagement",
component: () => import("pages/home-management/index.vue")
}
现在我有:
path: "/",
component: () => import("layouts/main-layout.vue"),
meta: { requiresAuth: true },
children: [
{
path: "home",
name: "homeManagement",
component: () => import("pages/home-management/index.vue")
}
我不明白为什么会这样。顺便说一下,homeManagement 的 path: "/"
也给我带来了加载问题。