Vite 热加载显示不一致的结果。为什么
Vite hotloading shows inconsistent results. Why
我有一个使用“脚本设置”的 Vite + Typescript + Vue 3 SPA。该应用程序使用 Urql 查询 GrapgQL 端点。
我有这样一种情况，只有在带有组件的组件 hotloaded.
之后，查询才有效并显示行
事件顺序：
- 在我的浏览器中使用 http://localhost:4000 加载应用程序。页面加载正常，但查询数据为 'undefined'。加载指示器暂时显示，但 result.data.value 未定义
- 重新加载页面 - 没有变化，加载指示器暂时显示，但 result.data.value 未定义
- 在 VS Code 中保存组件 (Ctrl + s) - 结果与 1 和 2 相同。
- 对组件代码做一个无关紧要的小改动，然后保存。 （我改了一条评论）组件是根据控制台热加载的，加载指示器没有显示但是这次result.data.value有预期的两个元素并且页面显示了它们。
- 重新加载页面 - 再次加载页面但查询结果未定义。
代码可见github：here
/src/components/TodoPrivateList.vue 是返回数据的地方（第 29 行）。在第 71 行，它使用子组件 TodoItem.vue 来渲染每个 Todo。
我现在可以看到，使用 Vue DevTools，数据总是被检索，但 Todos 没有呈现。只有当我强制热加载 TodoPrivateList.vue（通过更新其评论之一）时，才会呈现待办事项。
所以我现在同意@wittgenstein 的观点，这似乎是一个反应性问题。但是我还不知道该怎么做。
提前致谢
问题与Vite无关
问题是由于没有等待 graphql 查询的响应造成的。
在父组件中实现了“Suspense”选项。 （Vue 3 实验选项）并在查询中添加了 'await'。代码推送到 GitHub.
我有一个使用“脚本设置”的 Vite + Typescript + Vue 3 SPA。该应用程序使用 Urql 查询 GrapgQL 端点。
我有这样一种情况，只有在带有组件的组件 hotloaded.
之后，查询才有效并显示行事件顺序：
- 在我的浏览器中使用 http://localhost:4000 加载应用程序。页面加载正常，但查询数据为 'undefined'。加载指示器暂时显示，但 result.data.value 未定义
- 重新加载页面 - 没有变化，加载指示器暂时显示，但 result.data.value 未定义
- 在 VS Code 中保存组件 (Ctrl + s) - 结果与 1 和 2 相同。
- 对组件代码做一个无关紧要的小改动，然后保存。 （我改了一条评论）组件是根据控制台热加载的，加载指示器没有显示但是这次result.data.value有预期的两个元素并且页面显示了它们。
- 重新加载页面 - 再次加载页面但查询结果未定义。
代码可见github：here
/src/components/TodoPrivateList.vue 是返回数据的地方（第 29 行）。在第 71 行，它使用子组件 TodoItem.vue 来渲染每个 Todo。
我现在可以看到，使用 Vue DevTools，数据总是被检索，但 Todos 没有呈现。只有当我强制热加载 TodoPrivateList.vue（通过更新其评论之一）时，才会呈现待办事项。
所以我现在同意@wittgenstein 的观点，这似乎是一个反应性问题。但是我还不知道该怎么做。
提前致谢
问题与Vite无关
问题是由于没有等待 graphql 查询的响应造成的。
在父组件中实现了“Suspense”选项。 （Vue 3 实验选项）并在查询中添加了 'await'。代码推送到 GitHub.