注： transtion每次只能包含一个element。

<transition name="slide-fade">
    <i class="iconfont icon-list" v-show="!showMenu" @click="showMenu=!showMenu"></i>
</transition>
<transition name="slide-fade">
    <i class="iconfont icon-m-close" v-show="showMenu" @click="showMenu=!showMenu"></i>
</transition>

export default {
  name: 'Index',
  data () {
    return {
      showMenu:false,
      }
  }
}

.slide-fade-enter-active {transition: all .2s ease;}
.slide-fade-leave-active {transition: all .2s cubic-bezier(1.0, 0.5, 0.8, 1.0);}
.slide-fade-enter, .slide-fade-leave-to{transform: translateX(5px);opacity: 0;}