index.js 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", { value: true });
  3. var utils_1 = require("../common/utils");
  4. var component_1 = require("../common/component");
  5. var button_1 = require("../mixins/button");
  6. var open_type_1 = require("../mixins/open-type");
  7. var FIT_MODE_MAP = {
  8. none: 'center',
  9. fill: 'scaleToFill',
  10. cover: 'aspectFill',
  11. contain: 'aspectFit'
  12. };
  13. component_1.VantComponent({
  14. mixins: [button_1.button, open_type_1.openType],
  15. classes: ['custom-class', 'loading-class', 'error-class', 'image-class'],
  16. props: {
  17. src: {
  18. type: String,
  19. observer: function () {
  20. this.setData({
  21. error: false,
  22. loading: true
  23. });
  24. }
  25. },
  26. round: Boolean,
  27. width: {
  28. type: null,
  29. observer: 'setStyle'
  30. },
  31. height: {
  32. type: null,
  33. observer: 'setStyle'
  34. },
  35. radius: null,
  36. lazyLoad: Boolean,
  37. useErrorSlot: Boolean,
  38. useLoadingSlot: Boolean,
  39. showMenuByLongpress: Boolean,
  40. fit: {
  41. type: String,
  42. value: 'fill',
  43. observer: 'setMode'
  44. },
  45. showError: {
  46. type: Boolean,
  47. value: true
  48. },
  49. showLoading: {
  50. type: Boolean,
  51. value: true
  52. }
  53. },
  54. data: {
  55. error: false,
  56. loading: true,
  57. viewStyle: '',
  58. },
  59. mounted: function () {
  60. this.setMode();
  61. this.setStyle();
  62. },
  63. methods: {
  64. setMode: function () {
  65. this.setData({
  66. mode: FIT_MODE_MAP[this.data.fit],
  67. });
  68. },
  69. setStyle: function () {
  70. var _a = this.data, width = _a.width, height = _a.height, radius = _a.radius;
  71. var style = '';
  72. if (utils_1.isDef(width)) {
  73. style += "width: " + utils_1.addUnit(width) + ";";
  74. }
  75. if (utils_1.isDef(height)) {
  76. style += "height: " + utils_1.addUnit(height) + ";";
  77. }
  78. if (utils_1.isDef(radius)) {
  79. style += 'overflow: hidden;';
  80. style += "border-radius: " + utils_1.addUnit(radius) + ";";
  81. }
  82. this.setData({ viewStyle: style });
  83. },
  84. onLoad: function (event) {
  85. this.setData({
  86. loading: false
  87. });
  88. this.$emit('load', event.detail);
  89. },
  90. onError: function (event) {
  91. this.setData({
  92. loading: false,
  93. error: true
  94. });
  95. this.$emit('error', event.detail);
  96. },
  97. onClick: function (event) {
  98. this.$emit('click', event.detail);
  99. }
  100. }
  101. });