Vue圖像大小過濾器

我試圖解決一個問題，從URL與PHP（Codeigniter 3），所以每當我得到他們，有時會有太多，往往非常小，無用。我已經無數次嘗試使用Vue過濾器或PHP代碼片段來僅選擇圖像尺寸大於150x150的圖像網址。 PHP變得非常慢，我不會爲此而煩惱。我想的最後一件事是用jQuery：Vue圖像大小過濾器

所有的

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

首先，它不工作，而且還加載30張圖像將是緩慢以及一個過濾器。我的問題是：我可以刮更好這些圖像與VUE或任何JS，那麼只保留較大的，或使用一些其他過濾，也許隱藏較小的我使他們後？請高度讚賞任何建議。

來源

2016-04-26 Dandruff

你傳遞一個URL，然後返回相同的URL，是什麼應該做的？ – gurghet

我希望你知道VueJS過濾器是如何工作的，或者我錯了某處。該過濾器僅通過符合條件的圖像URL，在這種情況下，寬度大於150 px。這個過濾器放在v-for循環中，通過從RSS帖子鏈接接收的所有URL。 – Dandruff

來自官方文檔：'...過濾函數將一個值作爲參數，並返回轉換後的值...'如果您想在咖啡意義上進行過濾，則應該使用函數而不是過濾器來完成。 – gurghet

您正在篩選單個值（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 
}

來源

2016-04-27 10:02:17 gurghet

你是對的，功能是比過濾器更好的選擇。任何類型的** JS邏輯**這個問題將不勝感激。我從ajax請求獲取圖像url，並且必須以某種方式清除它們。 Vue.js有你提到的內置過濾器，但對於我必須用來獲取每個圖像的異步加載函數是沒用的。我有一個JS承諾的解決方案，將測試它，並分享它，如果它的工作。 – Dandruff

Vue圖像大小過濾器

回答

相關問題