rax-image/es/miniapp-native/ali-miniapp/index.js

Image component for Rax.

import fmtEvent from './fmtEvent';

var noop = function () {};

Component({
  data: {
    styleSheet: ''
  },
  props: {
    className: '',
    style: '',
    source: {
      uri: ''
    },
    placeholder: '',
    mode: 'scaleToFill',
    loading: 'eager',
    lazyLoad: false,
    onClick: noop,
    onLoad: noop,
    onError: noop
  },
  deriveDataFromProps: function deriveDataFromProps(nextProps) {
    this.initImage(nextProps);
  },
  didMount: function didMount() {
    if (!my.canIUse('component2')) {
      this.initImage();
    }
  },
  didUpdate: function didUpdate() {
    if (!my.canIUse('component2')) {
      this.initImage();
    }
  },
  methods: {
    onClick: function onClick(e) {
      var event = fmtEvent(this.props, e);
      this.props.onClick(event);
    },
    onLoad: function onLoad(e) {
      var event = fmtEvent(this.props, e);
      this.props.onLoad(event);
    },
    onError: function onError(e) {
      var event = fmtEvent(this.props, e);
      this.props.onError(event);
    },
    initImage: function initImage(nextProps) {
      var props = nextProps || this.props;

      var _ref = props.source || {},
          _ref$width = _ref.width,
          width = _ref$width === void 0 ? null : _ref$width,
          _ref$height = _ref.height,
          height = _ref$height === void 0 ? null : _ref$height;

      var style = props.style || '';
      if (width) style += 'width:' + width + 'rpx;';
      if (height) style += 'height:' + height + 'rpx;';
      if (style === this.data.styleSheet) return;
      this.setData({
        styleSheet: style
      });
    }
  }
});