vue2.0 food组件中小球动画出不来。。

来源：18-5 商品详情页实现（5）

安静的沙漠

2017-02-15

在goods组件中小球动画是正常的

food组件中console.log(event.target);结果是

也不报错，增减价格计算没有问题，不晓得到底是哪里出了问题。。。

<div class="cartcontrol-wrapper">
  <cartcontrol :food="food"></cartcontrol>
</div>

<!--加入购物车-->
<transition name="fade">
  <div @click="addFirst" class="buy" v-show="!food.count || food.count === 0">加入购物车</div>
</transition>

import BScroll from 'better-scroll';
import cartcontrol from 'components/cartcontrol/cartcontrol';
import Vue from 'vue';

export default {
  props: {
    food: {
      type: Object
    }
  },
  data() {
    return {
      showFlag: false
    };
  },
  methods: {
    show() {
      this.showFlag = true;
      this.$nextTick(() => {
        if (!this.scroll) {
          this.scroll = new BScroll(this.$refs.food, {
            click: true
          });
        } else {
          this.scroll.refresh();
        }
      });
    },
    hide() {
      this.showFlag = false;
    },
    addFirst(event) {
      if (!event._constructed) {
        return;
      }
      console.log(event.target);
      // 抛物线小球动画
      this.$emit('add', event.target);
      Vue.set(this.food, 'count', 1);
    }
  },
  components: {
    cartcontrol
  }
};

写回答

4回答