captain-ui/es/scroll/src/components/slide.js

有赞vue wap业务组件库

var _components;

import fullfillImage from '@youzan/utils/fullfillImage';
import Img from './img';
export default {
  render: function render() {
    var _vm = this;

    var _h = _vm.$createElement;

    var _c = _vm._self._c || _h;

    return _c('transition', {
      attrs: {
        "name": "slide",
        "enter-class": _vm.enterClass,
        "leave-active-class": _vm.leaveActiveClass
      },
      on: {
        "after-enter": _vm.afterEnter
      }
    }, [_c('div', {
      directives: [{
        name: "show",
        rawName: "v-show",
        value: _vm.active,
        expression: "active"
      }],
      staticClass: "cap-scroll-slide"
    }, [_c('a', {
      attrs: {
        "href": _vm.link,
        "target": "_blank",
        "index": _vm.index
      }
    }, [_c('div', {
      staticClass: "cap-scroll-slide__item js-load-res",
      attrs: {
        "data-src": _vm.imageUrl
      }
    }, _vm._l(_vm.data.anms, function (item, imgIndex) {
      return _c('cap-scroll-animate-img', {
        key: imgIndex,
        attrs: {
          "active": _vm.anmsStart,
          "item": item
        }
      });
    }), 1)])])]);
  },
  name: 'cap-scroll-slide',
  components: (_components = {}, _components[Img.name] = Img, _components),
  props: {
    index: Number,
    data: {
      type: Object,
      default: function _default() {
        return {};
      }
    },
    active: {
      type: Boolean,
      default: false
    },
    enterClass: String,
    leaveActiveClass: String
  },
  data: function data() {
    var link = this.data.linkUrl || 'javascript:void 0;';
    return {
      anmsStart: false,
      link: link,
      imageUrl: fullfillImage(this.data.imageUrl, '!640x320.jpg')
    };
  },
  watch: {
    active: function active(val) {
      if (!val) {
        this.anmsStart = false;
      }
    }
  },
  methods: {
    afterEnter: function afterEnter() {
      this.anmsStart = true;
      this.$emit('transitionend');
    }
  }
};