<div id="app">
  <button class="btn btn-primary" @click="toggle">toggle</button>
  <div class="wrapper clearfix">
    <div class="item1" v-show="selectedIdx === 1" transition="slide"></div>
    <div class="item2"  v-show="selectedIdx === 2" transition="slide"></div>
</div>
</div>
.wrapper
  width 100px
  height 200px
  overflow hidden
  > div
    width 100%
    height 100%
    
  .item1
    background-color blue
  .item2
    background-color red
    
.slide
  &-transition
    transition: transform .6s
    transform: translateZ(0)
  &-enter, &-leave
    transform: translateX(100%)
View Compiled
new Vue({
  el: '#app',
  data () {
    return {
      selectedIdx: 1
    }
  },
  methods: {
    toggle () {
      this.selectedIdx = this.selectedIdx === 1 ? 2 : 1
    }
  }
})
View Compiled
Rerun