0

在我的 main.js 文件中,我注册了 Vue:

import Vue from 'vue';
import VueRouter from 'vue-router';
import VueResource from 'vue-resource';
import VueI18n from 'vue-i18n';

import App from './components/App.vue';

// Register plugins
Vue.use(VueResource);
Vue.use(VueRouter);
Vue.use(VueI18n);

// Create router
const router = new VueRouter({
  history: true,
  saveScrollPosition: true,
});

router.start({
  components: { App },
}, 'body');

现在我想在我的 App.Vue 中获取一个翻译文件:

<script>
export default {
  ready() {
    /* Set Language */
    Vue.locale('nl', function setLanguage() {
      return this.$http({
        url: '/src/language/nl_NL.js',
        method: 'get',
        headers: {
          Accept: 'application/json',
          'Content-Type': 'application/json',
        },
      })
      .then((response) => {
        Vue.locale('nl', response);
        Vue.config.lang = 'nl';
      }).then(() => {
        alert('Error');
      });
    });
  },

};
</script>

我得到了错误:'Vue' is not defined。我究竟做错了什么?

4

2 回答 2

1

我的猜测是您缺少 vue 的 import 语句App.vue,因为 vue 不会自动将自身注入 vue 文件 AFAIK:

<script>
import Vue from 'vue'; // <--

export default {
  ready() {
    /* Set Language */
    Vue.locale('nl', function setLanguage() {
      return this.$http({
        url: '/src/language/nl_NL.js',
        method: 'get',
        headers: {
          Accept: 'application/json',
          'Content-Type': 'application/json',
        },
      })
      .then((response) => {
        Vue.locale('nl', response);
        Vue.config.lang = 'nl';
      }).then(() => {
        alert('Error');
      });
    });
  },

};
</script>
于 2016-09-23T12:42:29.697 回答
0

对于我从您的代码中可以理解的内容,您的 Vue 应用程序是在您让 Vue 使用所有依赖项之前创建的。只有在完成所有这些 Vue.use(*) 之后,您才应该创建应用程序实例。它应该这样做。另外,最好this在组件内部使用来引用 Vue 的正确实例。在您的方法中,您可以这样做self = this,以保护自己免受范围问题的影响。在子组件内部,您可以使用 this.$root 来引用应用组件。我希望这有帮助。

于 2016-09-23T12:07:17.900 回答