axios経由でvue-routerメッセージを設定する

Question

バックエンドアプリケーションへのapi呼び出しによって翻訳メッセージを取得したいと考えています。 axiosコールのthenコールバックで、私はメッセージを設定したいと思います。

しかし、VueRouterは既に空の変換で初期化されていて、thenコールバックから新しいものでリロードされないという問題があるようです。

これを達成する方法はありますか？

私が試してみた：

let messages = {}; 
window.axios.get(route('api.translation.translations.all')) 
    .then(response => { 
     messages = { 
      [currentLocale]: response.data, 
     } 
    }); 
console.log(messages); 

const i18n = new VueI18n({ 
    locale: currentLocale, 
    messages, 
}); 

これは、メッセージが完全に設定される前にnew VueI18nが呼び出されるように動作しません。

window.axios.get(route('api.translation.translations.all')) 
    .then(response => { 
     messages = { 
      [currentLocale]: response.data, 
     }; 
     console.log(messages); 
     app.$i18n.setLocaleMessage('en', messages) 
    }); 

これも機能しません。

ありがとうございます！

Answer 1

解決策が見つかりました。私はロケールを指定する必要はありませんでした。これはsetLocaleMessageの最初の引数です。

window.axios.get(route('api.translation.translations.all')) 
    .then(response => { 
     messages = response.data; 

     app.$i18n.setLocaleMessage(currentLocale, messages); 
    });