增加指令resolveImg;增加img-lazy组件以解决v-lazy指令不能使用filters的问题

src/components/img-lazy/index.vue

@@ -0,0 +1,10 @@
+<template>
+  <img v-lazy="src" />
+</template>
+<script>
+export default {
+  props: {
+    src: String
+  }
+}
+</script>

src/filters/resolveAvator.js

@@ -1,3 +0,0 @@
-import { getFileUrl } from '@/services/oss';
-
-export default imgSrc => getFileUrl(imgSrc) || '/static/img/avator_default.svg';

src/filters/resolveImg.js

@@ -0,0 +1,8 @@
+import { getFileUrl } from '@/services/oss';
+
+export const resolveAvator = imgSrc => getFileUrl(imgSrc) || '/static/img/avator_default.svg';
+
+export default (imgSrc, imgType) => {
+  const defaultImg = imgType === 'avator' ? '/static/img/avator_default.svg' : ''
+  return getFileUrl(imgSrc) || defaultImg;
+};

src/main.js

@@ -10,9 +10,10 @@ import 'element-ui/lib/theme-chalk/index.css';
 import store from './store';
 import vuex from 'vuex';
 import Cookies from 'js-cookie'
-import resolveAvator from '@/filters/resolveAvator';
+import resolveImg ,{ resolveAvator } from '@/filters/resolveImg';
 import VueLazyload from 'vue-lazyload'
 import VueContextMenu from '@xunlei/vue-context-menu'
+import LazyImg from '@/components/img-lazy';
 
 // 加载其他css
 import "@/../public/static/css/element_chanage.css"
@@ -29,12 +30,14 @@ Vue.use(ElementUI);
 Vue.use(VueLazyload);
 Vue.use(vuex);
 Vue.prototype.$cookie = Cookies;
+Vue.component('ImgLazy', LazyImg);
 
 // todo DEPRECATED
 Vue.prototype.$axios = axios;
 // todo DEPRECATED
 Vue.prototype.$fetch = axios;
 Vue.prototype.$fetchApi = fetchApi;
+Vue.filter('resolveImg', resolveImg);
 Vue.filter('resolveAvator', resolveAvator);
 
 //右键菜单

src/views/demo/index.vue

@@ -25,6 +25,10 @@
         <app-nav :list="navList" />
       </template>
     </app-header>
+    <div style="height: 2000px" />
+    <img-lazy :src="'oss://1603443894479/bz.jpg' | resolveAvator" />
+    <img v-lazy="'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1603457396447&di=9046aaf5b7fc79ce05e28cb76f289862&imgtype=0&src=http%3A%2F%2Fa3.att.hudong.com%2F14%2F75%2F01300000164186121366756803686.jpg'" />
+    <img :src="'oss://1603443882955/9.jpg' | resolveAvator" />
   </div>
 </template>
 

src/views/main_web/index/index.vue

@@ -84,7 +84,7 @@
                     <img
                       class="fandatupian"
                       @click="goFilePage(projItem)"
-                      v-lazy="projItem.showImgUrl | resolveAvator"
+                      :src="projItem.ShowImgUrl | resolveImg"
                       alt
                     />
                     <div class="yiyun_product_item_top">