时间戳

首页 > 解决方案 > 无法从 Nuxt 应用程序的经典模式存储中的突变访问 i18 插件

vue.js - 无法从 Nuxt 应用程序的经典模式存储中的突变访问 i18 插件

问题描述

我正在尝试在我的 Nuxt 应用程序中实现 Vuex i18n 包。在插件数组中的 nuxt.conf.js 文件中，我有：

{
    src: '@/plugins/i18n.js',
    ssr: false
},

plugins/i18n.js 文件是：

import Vue from "vue";
import vuexI18n from "vuex-i18n/dist/vuex-i18n.umd.js";
import toEnglish from "../translations/toEnglish";
import toSpanish from "./../translations/toSpanish";
import toGerman from "./../translations/toGerman";

export default ({ store }) => {
    Vue.use(
        vuexI18n.plugin,
        store,
        {
            onTranslationNotFound: function (locale, key) {
                console.warn(`vuex-i18n :: Key '${key}' not found for locale '${locale}'`)
            }
        }
    );

    // register the locales
    Vue.i18n.add('en', toEnglish);
    Vue.i18n.add('de', toGerman);
    Vue.i18n.add('es', toSpanish);

    // Set the start locale to use
    Vue.i18n.set('de');
    Vue.i18n.fallback('en');
}

最后一件事是我的商店。我在 Nuxt 中使用 vuex 商店的经典模式：

import Vuex from "vuex";

const store = () => {
    return new Vuex.Store({
        state: () => ({
            currentLanguage: ''
        }),
        mutations: {
            changeLang(state, response) {
                if (response) {
                    console.log(this);
                    state.currentLanguage = response;
                    this.i18n.set(response);
                }
            }
        }
    })
};


export default store;

this正如您在存储文件中看到的那样，我正在尝试使用关键字访问 i18n 插件。不幸的是，在控制台中出现打印错误：

TypeError：无法读取未定义的属性“集”

this我也在突变内部安慰的是：

无法从 nuxt 应用程序的经典模式存储中的突变访问 i18 插件

标签： vue.jsvuejs2internationalizationvuexnuxt.js

解决方案

我改变this.i18n.set(response);了state.i18n.locale = response;我的突变，现在它似乎工作了。

出于某种原因，当我调用此突变时，我的 video.js 播放器会刷新。我会尝试找出原因。

推荐阅读