Vue-i18n単一ファイルコンポーネントの構文とルートメッセージの結合

Question

Vue用の優れたvue-i18nプラグインを試しています。 neat featureがあり、翻訳が必要なテンプレートに直接翻訳を埋め込むことができます。しかし、私がそれらを使うと、私はルート翻訳ノードにアクセスすることができません。このモデルはサポートされていますか、それとも間違っていますか？コンポーネントで、あなたは両方へのアクセスを持つことになり国際化の定義がmerged togetherているように、と思わ

main.js

import VueI18n from 'vue-i18n'; 
Vue.use(VueI18n); 
const i18n = new VueI18n({ 
    locale: 'en', 
    messages: { 
    en: { 
     'company-name': 'billy-bob\'s fine steaks.' 
    } 
    } 
}); 

Sample.vue

<i18n> 
    { 
    "en": { 
     "title": "@:company-name - yeee hawwww!!!" 
    } 
    } 
</i18n> 

<template> 
    <div id="app" class="container"> 
    <site-header :title="$t('title')"></site-header> 
    </div> 
</template> 

Answer 1

親と子のi18n定義。子定義は、重複があった親をオーバーライドします（たとえば、titleキーがある場合など）。親と子、子供が使用される）。

ただし、使用している構文は正しく動作しません。この場合、私は、2つの変換された値を結合し、それを使用する計算を定義すると思います。

computed:{ 
    title(){ 
     return this.$t("company-name") + this.$t("title") 
    } 
} 

そして、テンプレートで計算された値を使用してください。

<template> 
    <div id="app" class="container"> 
    <site-header :title="title"></site-header> 
    </div> 
</template>