9-7#去哪儿网app#画廊动画效果

目的：为画廊添加动画，实现渐隐渐现的效果。动画用transition，在之前用到过。

继续在common文件夹中创建组件，用到插槽：

<template>
    <transition>
        <slot></slot>
    </transition>
</template>

在banner中注册组件，并把标签改为：

<fade-animation>
    <common-gallary :imgs="gallaryImgs" v-show="showGallary"
    @close="handleGallaryClose"></common-gallary>
</fade-animation>

这样写，common-gallary就会作为插槽，插入到animation的组件中，slot代表common-gallary，而slot外部又加入了动画效果(transition标签，下面的样式是相匹配的，直接写就可以：)

<style lang="stylus" scoped>
    .v-enter, .v-leave-to
        opacity :0
    .v-enter-active, .v-leave-active
        transition : opacity  .5s
</style>

当common-gallary展示和隐藏的时候，就完成了渐隐渐现动画。

至此，项目的所有代码部分完成。

git提交~