Vue/Laravel 如何更快地加载 axios 调用答案

【问题标题】：Vue/Laravel How to load axios calls fasterVue/Laravel 如何更快地加载 axios 调用
【发布时间】：2021-02-18 06:20:06
【问题描述】：

我正在使用 Axios 调用，它正在调用一个大型 json 文件。每次进行此调用时，页面都会在加载内容之前挂起大约 2 秒，有没有办法不让页面冻结以便我可以显示加载栏或完全加快 axios 调用？我正在尝试将 json 数据保存在全局变量中，但是我不知道该怎么做

【问题讨论】：

是调用还是渲染？默认情况下，Axios 调用是异步的，因此它们不应该锁定页面，但如果它是一个巨大的 JSON 文件，您的 JavaScript 前端必须呈现，那可能会锁定那里的浏览器。
啊，是的，调用是瞬时的，但是渲染锁定了页面。 vue 是否有任何技术或方法可以在不锁定页面的情况下加速或渲染，以便我可以使用 vuetify 加载器来指示数据正在加载
这在很大程度上取决于数据以及您正在使用它做什么。 stackoverflow.com/questions/48515997/… 处理大数据集的潜在方法；你确定你不能分页吗？
所以我目前正在处理的数据是全部加载并使用 v-if 语句来查看数据是否属于页面。我采取的方法也是合适的，还是应该使用 Vuex 或 laravel 控制器之类的东西来处理这个逻辑
在 Laravel 控制器级别进行分页会更好，是的。

【解决方案1】：

除非您的 .json 文件中的数据太长，否则我认为没有其他原因会导致页面冻结。在这种情况下，我强烈建议您将它们存储在数据库中并使用 laravel 分页。如果数据很大，但不遵循规律，可以放到控制器中，根据需要用if分隔。

【讨论】：