问题标签 [vue-infinite-loading]

我有一个展品清单。用户可以添加展品。当用户添加展品时，vue-infinite-loading不会注意到展品数量的变化，因此即使有更多要展示，它也会显示“列表结束”。

这是一支代码笔。注意：我无法让 vue-infinite-loading 在沙箱中工作，但它肯定在我的网站上工作。

这是代码：

HTML：

JS：

在上面的示例中，发生了什么：

1. 页面加载，显示 15 条记录
2. 用户单击“添加 10 条记录”按钮
3. exhibits.meta.totalRecords增加 10
   • 这应该告诉无限加载器刷新
4. 用户向下滚动到底部 10px 以内，无限加载显示一个微调器，而 loadMore 将 10 行添加到exhibits.results和exhibits.resultsMap

我尝试过的事情：

• 强制重置：
  • ，addTenRows在我加十之后meta.totalRecords
  • this.$refs.infiniteLoading.stateChanger.reset();- 没有什么变化
  • this.$refs.exhibitLoader.stateChanger.reset();- 错误，exhibitLoader未定义。
  • this.exhibitLoader.stateChanger.reset();- 错误，exhibitLoader未定义。

我正在使用vue 无限负载从本地 api 获取评论。在谷歌浏览器工具的网络选项卡中，我的页面请求应按如下方式加载：

101?页=1

101?页=2

101?页=3

101？页=4

但真正发生的事情是我得到了第 1 页的副本，它跳过了第 2 页：

101?页=1

101?页=1

101?页=3

101？页=4

代码

注意：即使我将parentPageCount道具更改为 2，也会发生此页面跳过。所以它将是：101?page=2 101?page=2 101?page=4

我正在使用 vue-infinite-loading。我跟着他们的文件。但不明白。什么是 $state , $state->loaded(),$state->complete();

下图是我面临的错误。

我正在尝试使用 vue-InfiniteLoading 组件实现无限加载。每次滚动时我都会得到一个数组，当我获取数据时我尝试将数组中的内容推送到另一个数组。当我使用推送时，我在屏幕上看到新元素，但没有图像和信息..

我尝试了 push、concat 和 foreach，它们都不适合我。response.data.data.data 是包含新元素的数组，dorms 是 UI 上显示的主数组。

我也试过 push (...response.data.data.data)

我希望数组中的所有信息都被推送，但它不起作用。

我是 vuex 和 vue 的初学者，我需要在 vuex 项目中使用无限加载，但它不起作用，我需要一些专家的帮助。我将提供以下详细信息：

我在 index.js 中的 vuex 代码

而且我的vue代码显示在这里，但是出了点问题。

还有我的api

但 InfiniteLoading 不起作用！我不知道是什么问题以及我应该在哪里寻找，你知道我应该改变什么和工作吗？提前谢谢你，我期待看到你的回复。

我想在替换另一个即将到来的数据列表之前保留一个数据列表。我在我的 vuejs 项目中使用这个插件：https ://peachscript.github.io/vue-infinite-loading来加载更多数据。

设想：

1. 通过调用加载更多处理函数重新加载以获取数据列表
   • 在 Vuex 中做一个动作请求并存储在一个状态中
   • 列出来自 Vuex 状态的数据
2. 过滤另一个数据并列出
   • 保留以前的数据列表，同时另一个即将替换的数据列表

在替换为即将到来的数据列表之前保留当前数据列表

目前，我通过将数据列表重置为 null 来加载更多处理函数来获取数据以获取新数据，这就是我的数据列表为空的原因。

在我的 Vue 应用程序中使用 vue-infinite-loading 组件时出现问题

1. 当我打开可折叠组件时，它将运行 vue-infinite-loading 并在第一次加载后不滚动也将再次运行 vue-infinite-loading，尝试更改距离并使用 force-use-infinite-wrapper 但仍然相同的结果. 有什么帮助吗？

这是我的示例代码：

如果您能回答上述任何问题，那就太好了！

我在Nuxt上使用vue-infinite-loading并且效果很好。问题是如果其中一项被修改，它不会在屏幕上刷新，直到重新加载（例如，更改标识符）。有什么办法或考虑让它反应吗？谢谢

我正在开发 Nuxt 应用程序。对于我的一个动态页面，我想显示无限滚动的数据。为此，我决定使用Vue-infinite-loading。我阅读了这篇文章，还浏览了Vue-infinite-loading的文档。在他们两个中，他们都使用axios模块逐步加载数据，以在滚动到达该页面中的特定点时显示在页面中。但是在我的页面中，在$strapi模块和 Nuxt提取钩子的帮助下，数据已经根据 page-id 存在于页面中。我的页面的整个代码如下：

在代码中，我在 fetch 挂钩中获取数据（根据页面 id 不同），然后将其放入listBooks Vue 数据中。我想要做的是首先在listBooks中显示例如2 个数据，当滚动到达第二个数据（此处为第二张卡）的末尾时，我使用无限滚动方法逐步显示其余数据。所以我使用了一个名为listShow的计算数据并在 v-for 中使用它。然后我把我认为也许它可能在infiniteScroll方法中工作的代码。但显然这不起作用，因为我只是猜测。如果有人知道如何更改该代码以工作并在无限滚动中显示数据，请帮助我解决这个问题。