javascript - Vue图像大小过滤器

Question

我正在尝试解决使用 PHP (Codeigniter 3) 从 URL 提取/抓取图像的问题，因此每当我获取图像时，有时图像太多，而且通常非常小且无用。我已经无数次尝试制作 Vue 过滤器或 PHP 代码片段来仅选择那些图像尺寸大于 150x150 的图像 url。 PHP 变得非常慢，我不会为此烦恼。我最后尝试的是使用 jquery:

Vue.filter('imagesize', (url) => {
  var tmpImg = new Image()
  tmpImg.src = url
  $(tmpImg).one('load', () => {
    if (tmpImg.width > 150) { 
      return url
    }
  })
})

首先它不起作用，而且对于过滤器来说加载 30 张图像也会很慢。我的问题是:我可以使用 vue 或任何 JS 更好地抓取这些图像，然后只保留较大的图像，或者使用一些其他过滤器，或者隐藏较小的渲染后它们？如有任何建议，我们将不胜感激。

Answer 1

您正在对单个值(URL)进行过滤，您真正应该做的是对 URL 数组进行过滤，就像过滤器过滤器的实现方式一样。看一下源代码，我删除了无聊的部分:

export function filterBy (arr, search, delimiter) {
  ... stuff ...
  for (var i = 0, l = arr.length; i < l; i++) {
    ... stuff ...
      if (/*some condition items must pass*/) { // <-- here you put the condition on size
          res.push(item)
    ... stuff ...
  return res
}