myImage.vue 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. <template>
  2. <view>
  3. <image v-if="isIcon" style="border-radius: 60rpx;" :class="[mymode=='widthFix'?'imageW':'imagev']" :src="showdefault==1?'/static/logo.png':baseUrl+comUrl" :mode="mymode" @error="imageError" @click="myimageclick"></image>
  4. <image v-if="!isIcon" :class="[mymode=='widthFix'?'imageW':'imagev']" :src="showdefault==1?'/static/logo.png':baseUrl+comUrl" :mode="mymode" @error="imageError" @click="myimageclick"></image>
  5. </view>
  6. </template>
  7. <script>
  8. export default {
  9. name:"myImage",
  10. props:{
  11. mysrc: '',
  12. mymode:'',
  13. isIcon:false
  14. },
  15. data() {
  16. return {
  17. defaultImage:'/static/logo.png',
  18. baseUrl:getApp().globalData.getUrl(1),
  19. showdefault:0,
  20. comUrl:this.mysrc
  21. };
  22. },
  23. watch: {
  24. mysrc(val){
  25. this.showdefault=0;
  26. this.comUrl = this.mysrc;
  27. // console.log(this.baseUrl);
  28. }
  29. },
  30. methods:{
  31. imageError(){
  32. //this.comUrl = this.defaultImage;//morentup
  33. this.showdefault=1;
  34. },
  35. myimageclick(comUrl){
  36. console.log(this.baseUrl+this.comUrl);
  37. this.$emit('Emyimageclick',comUrl);
  38. },
  39. },
  40. }
  41. </script>
  42. <style>
  43. .imageW{
  44. margin: 0rpx;
  45. width:100%;
  46. }
  47. .imageH{
  48. margin: 0rpx;
  49. height:100%;
  50. }
  51. .imagev{
  52. width:100%;
  53. height:100%;
  54. }
  55. </style>