在子組件
```
<template>
<transition>
<slot name="fade"></slot>
</transition>
</template>
<script>
export default {
name:"VFade"
}
</script>
<style lang="scss" scoped>
.v-enter,.v-leave-to{
opacity: 0;
}
.v-enter-active,.v-leave-active{
transition: opacity 1s;
}
</style>
```
父組件
1.先引用import
2.在components:{}中注冊子組件
3.哪里要用就套在哪個的外面，然后在用的那里添加**slot="fade"**，如下代碼：
```
<v-fade>
<detail-gallary slot="fade" v-show="isGallary" @toggle="hide" :gallaryImgs="gallaryImgs"></detail-gallary>
</v-fade>
```
