<script src="https://unpkg.com/vue/dist/vue.js"></script>

<div id="in-out-translate-demo" class="demo">

  <div class="in-out-translate-demo-wrapper">

    <transition name="in-out-translate-fade" mode="in-out">

      <button v-if="on" key="on" @click="on = false">

        on

      </button>

      <button v-else="" key="off" @click="on = true">

        off

      </button>

    </transition>

  </div>

</div>

<script>

new Vue({

  el: '#in-out-translate-demo',

  data: {

    on: false

  }

})

</script>

<style>