（2）を用いて、I18N

それが直接書かれmain.jsの最初の段階として書かれてはならないので、プロジェクトでは、コンテンツの多くに関与する可能性があるため、

1：作成

必要なカタログでは、自分の名前のJSONファイルで2自体を作成します

例：

2：書き込みJSONファイル

//zh.js 
module.exportsは={
    件名：{
        タイトル：'タイトル'
    }、
    メッセージ：{
        ログイン：'ログイン'、
        ユーザー名：'名前'、
        パスワード：'パスワード'、
    }、
    言語：{
        ZH：「中国'
        EN：'英語"
    }
}

//en.js
 module.exportsは={
  件名：{
    タイトル：'タイトル'
  }、
  メッセージ：{
    ログイン：'ログイン'、
    ユーザー名：'ユーザー名'、
    パスワード：'パスワード'、
  }、
  言語：{
    ZH：「中国"、
    EN：'英語'
  }
}

3：main.jsを導入

国際化= constの新しい新VueI18n（{ 
  ロケール： 'EN'、// 言語識別
  メッセージ：{
     'ZHは'： './コンポーネント/共通/ ZH'（必要）、
     'EN'：コンポーネント/共通./「（必要/ EN " ）
  } 
}）

4：ページを使用します

<テンプレート> 
  <DIV> 
    <DIV ID = "アプリケーション"> 
      <divのスタイル= "マージン：20ピクセル;"> 
        <H1スタイル= "色：スカイブルー;"> {{$ T（ "subject.title"）}} < / H1> 
        の<div> 
          <ラベル用 > {{$ T（ 'message.Username'）}} </ラベル> 
          の<input type = "text"：プレースホルダ= "$ T（ 'message.Username'）" / > 
        </ div> 
        <div> 
          <ラベル用 > {{$ T（ 'message.Password'）}} </ラベル> 
          の<input type = "text"：プレースホルダ= "$ T（ 'message.Password'） "/> 
        </ div>
      </ div> 
      <divのスタイル= "マージン：20ピクセル"> 
        中文</ button>の<ボタンをクリック@ = "btnzh"> 
        英语</ button>の<クリック= "btnEn" @ボタン> 
      </ div> 
    </ div>
  </ DIV> 
</テンプレート> 
<スタイルLANG = ""> 
</スタイル> 
<スクリプト> 
エクスポートデフォルト{ 
  データ（）{ 
    リターン{ 
    }; 
  }、 
  （）{}、マウント
  方法：{ 
    {btnzh（）
      これ。 i18n.locale = $ "ZH" ; 
    }、
    btnEn（）{ 
      この $ i18n.locale = "EN" ; 
    } 
  } 
};
 </ SCRIPT> 
請求項
1：$ Tは（）I18Nの方法であって、
2：書き込み道

1：<H1> {{$ T（ "対象"）タイトル}} </ H1>

2：<H1> {{$ T（ "subject.title"）}} </ H1>

3：<H1> {{$ T（ "対象"）[ 'タイトル']}} </ H1>

結果は

おすすめ