vue-i18nで引数を渡す方法

ツイート
2021年05月10日
2021年05月11日

VueJSとvue-i18nを使って実装を進めている多言語対応に、引数を渡して表示できるようにしたい。

JSON

以下のようなjsonがある場合のケースです。
ja.json

json
{ "LIMIT_MINUTES": "あと%{minutes}分で制限されます。" }

en.json

json
{ "LIMIT_MINUTES": "limited to %{minutes} more minutes.", }

引数の渡し方

%{value}で定義し、第二引数に{ value: value }で渡す。

js
this.$t('LIMIT_MINUTES', { minutes: 6 }) // => あと6分で制限されます。