javascript 有没有更好的延迟加载q-select的方法？

ztmd8pv5 于 2023-01-04 发布在 Java

关注(0)|答案(1)|浏览(143)

我在关注https://quasar.dev/vue-components/select#lazy-loading我有

@filter="filterFn"
@filter-abort="abortFilterFn"

在q选择和滤波器中Fn是

filterFn (val, update, abort) {
        if (options.value !== null) {
          // already loaded
          update()
          return
        }

        setTimeout(() => {
          update(() => {
            options.value = store.data;
          })
        }, 2000)
      },

所以当我的API取回数据时，它会把数据放到pinia存储中，这发生在从相邻组件的另一个q-select中选择选项时，我会观察q-select的模型，当它发生变化时，我调用我的API传递参数（我现在知道，因为选择）和更新存储一旦我有数据。然而，我必须等待数据回来，这就是为什么我'我使用的是惰性加载。它很有效，但是setTimeout并不高效。有时候数据返回的非常快，有时候如果有很多选项的话，加载的时间只有几秒钟。有时候我不知道要花多长时间。所以如果时间超过2秒，函数就不会加载到我的q-select中。它只是显示为空白。但是我没有我不想把它设置得更高，让用户为一个可能只需要一秒钟的调用等待3秒钟。我正在使用承诺和解析来获取数据，我如何异步延迟加载呢？

JavaScript

来源：https://stackoverflow.com/questions/74996514/is-there-a-better-way-to-lazy-load-a-q-select

1条答案

按热度按时间

r3i60tvu1#

你可以删除timeout函数。在这个例子中，它只是用来模拟一个API的延迟响应，但在真实的生活中并不是必需的。如果你依赖一个Pinia商店，你可能会想把你的商店数据作为一个计算的 prop 返回，以便正确地观察api的响应。

const myStoreData = computed(() => {
  return store.data
});

filterFn (val, update, abort) {
  if (options.value !== null) {
   update()
    return
 } else {
 update(() => {
  options.value = myStoreData.value;
 })
}},

赞(0）回复(0）举报 2023-01-04

我来回答

javascript 有没有更好的延迟加载q-select的方法？

1条答案

相关问题

热门标签

最新问答