beforeDestroy can not find this.$t

by masongzhi

HTML

<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/vue-i18n/dist/vue-i18n.js"></script>
<div id="app">
  <p>{{ $t("message.hello") }}</p>
  <button @click="destoryVm">destory vm</button>
</div>

CSS

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

#app {
  background: #fff;
  border-radius: 4px;
  padding: 20px;
  transition: all 0.2s;
}

Vue

const messages = {
  en: {
    message: {
      hello: 'hello world'
    }
  },
  ja: {
    message: {
      hello: 'こんにちは、世界'
    }
  }
}

// Create VueI18n instance with options
const i18n = new VueI18n({
  locale: 'ja', // set locale
  messages, // set locale messages
})


new Vue({
  el: "#app",
  i18n,
  methods: {
  	destoryVm() {
    	this.$destroy()
    }
  },
  beforeDestroy() {
  	alert(this.$t("message.hello"))
  }
})