我有一个从lang.min.js创建的Lang对象：
https://github.com/rmariuzzo/Lang.js
在我的Laravel应用中，我有以下内容app.js：
import SearchToggle from './components/toggle.vue'
import Lang from './lang.min.js'
...
Vue.component('toggle', Toggle);
...
var lang = new Lang();
lang.setMessages(require('./messages.js'));
console.log(lang.getLocale());
console.log(lang.get('main.specialties'));
...
lang对象没有错误，并设法按预期输出get。
现在，我在以下目录中添加了一个vue组件，如上所示： ressource/assets/js/components/toggle.vue
在脚本部分：
<script>
export default{
data(){
return {
text_holder: lang.get('main.specialties'),
}
},
...
}
但是，这不起作用。它抱怨说lang是未定义的。我想我错过了javascript范围的差距（概念）。我以为如果所有内容都在app.js中并被导入，那么var lang就应该是它的全局作用域，并且我可以在导入过程中的任何地方使用它（类似于php的供应商方式），我猜不是。
现在我该怎么办？在每个vue组件上进行导入（但随后我必须确保向后的路径正确，并且多次加载相同的对象/ message.js会使JavaScript膨胀。
非常感谢JS的帮助。
创建您的lang.js，并导出lang实例
var lang = new Lang();
lang.setMessages(require('./messages.js'));
...
export default lang;
那么您可以在组件中导入并使用该实例
import lang from 'path/to/lang'
export default {
data () {
return {
text_holder: lang.get('main.specialties'),
...
}
}
}
另一种方法是编写插件，您可以将其注入langVue，从而可以访问lang组件。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句