Showing
2 changed files
with
20 additions
and
4 deletions
1 | <template> | 1 | <template> |
2 | - <img v-lazy="currentSrc" :alt="alt" v-if="currentLazy"> | ||
3 | - <img :src="currentSrc" :alt="alt" v-else lazy="" data-src=""> | 2 | + <img v-lazy="currentSrc" :alt="alt" v-if="currentLazy" @error="onError"> |
3 | + <img :src="currentSrc" :alt="alt" v-else lazy="" data-src="" @error="onError"> | ||
4 | </template> | 4 | </template> |
5 | 5 | ||
6 | <script> | 6 | <script> |
@@ -61,6 +61,11 @@ export default { | @@ -61,6 +61,11 @@ export default { | ||
61 | .replace('{width}', this.width) | 61 | .replace('{width}', this.width) |
62 | .replace('{height}', this.height); | 62 | .replace('{height}', this.height); |
63 | } | 63 | } |
64 | + }, | ||
65 | + methods: { | ||
66 | + onError() { | ||
67 | + this.$emit('error'); | ||
68 | + } | ||
64 | } | 69 | } |
65 | }; | 70 | }; |
66 | </script> | 71 | </script> |
1 | <template> | 1 | <template> |
2 | - <ImageFormat :lazy="lazy" class="img-avatar" :src="imageSrc" :width="width" :height="height"></ImageFormat> | 2 | + <ImageFormat :lazy="lazy" class="img-avatar" :src="imageSrc" :width="width" :height="height" @error="errorHandle"></ImageFormat> |
3 | </template> | 3 | </template> |
4 | 4 | ||
5 | <script> | 5 | <script> |
@@ -23,9 +23,20 @@ export default { | @@ -23,9 +23,20 @@ export default { | ||
23 | default: false | 23 | default: false |
24 | } | 24 | } |
25 | }, | 25 | }, |
26 | + data() { | ||
27 | + return { | ||
28 | + imgSrc: this.src, | ||
29 | + defaultSrc: '//img11.static.yhbimg.com/yhb-img01/2016/07/05/13/017ec560b82c132ab2fdb22f7cf6f42b83.png?imageView/2/w/{width}/h/{height}' | ||
30 | + }; | ||
31 | + }, | ||
26 | computed: { | 32 | computed: { |
27 | imageSrc() { | 33 | imageSrc() { |
28 | - return this.src || '//img11.static.yhbimg.com/yhb-img01/2016/07/05/13/017ec560b82c132ab2fdb22f7cf6f42b83.png?imageView/2/w/{width}/h/{height}'; | 34 | + return this.imgSrc || this.defaultSrc; |
35 | + } | ||
36 | + }, | ||
37 | + methods: { | ||
38 | + errorHandle() { | ||
39 | + this.imgSrc = this.defaultSrc; | ||
29 | } | 40 | } |
30 | } | 41 | } |
31 | }; | 42 | }; |
-
Please register or login to post a comment