Question

主要情况是使vue与外部合作。我有一个由vue-i18n完成的具有国际化功能的现成应用程序。要切换语言，我需要更改i18n的语言环境：

i18n.locale = newLanguageSlug

问题在于此应用只是整个网站的一部分，该网站拥有自己的语言切换器。我想要获得的是在网站上更改应用程序时更改其语言。我正在使用webpack，所以第一个想法是将vue导出为一个函数，然后将一些参数作为prop传递：

main.js

export function runApp(langSlug){
new Vue({
    i18n,
    el: '#app',
    render: h => h(App, {props:{
        currentLang: newLanguageSlug
    }})
  })
}

然后我在 index.html 中调用此函数：

    <div id="app"></div>
    <script src="./dist/build.js"></script>

    <script>
        translation.runApp(newLanguageSlug)
    </script>

但是，要使其正常工作，每次我在网站上切换语言时，都必须重新调用函数“ translation.runApp（newLanguageSlug）”，该网站将在vue应用程序的“ created（）”实例中运行更改的语言环境功能

...
props:[
  'currentLang',
],
...
created(){
    i18n.locale = this.currentLang
}

那么有可能以某种方式在build.js之外导出更改语言环境的函数吗？我想省略重新调用“ translation.runApp（newLanguageSlug）”功能。

PS：“翻译”名称来自 webpack.config.js ：

output: {
   path: path.resolve(__dirname, './dist'),
   publicPath: './dist/',
   filename: 'build.js',
   library: 'translation'
},

在“构建”文件之外调用vue方法

0 个答案: