Get the currently selected language ID in Shopware

How to obtain the currently selected API language from Shopware vue components.

155 views

By. Jacob

Created: 2024-03-16 12:53

When working on vue.js based administration plugins, you may sometimes need the language id of the currently selected language; this is available in the Shopware object, specifically in Shopware.Context.api.languageId.

So, if you wish to obtain it when your component first loads, you can assign it in the created() lifecycle. E.g:

created() {
    this.selectedLanguageId = Shopware.Context.api.languageId;
    this.systemDefaultLanguage = Shopware.Defaults.systemLanguageId;
}

Remember to also define the relevant properties, such as selectedLanguageId and systemDefaultLanguage. E.g:

data() {
    return {
        selectedLanguageId: null,
        systemDefaultLanguage: null,
    };
},

The systemLanguageId contains the default system language, as defined in Shopware's core files.

After doing this, you will be able to access the selected language ID via this.selectedLanguageId inside of your functions and computed properties.

And, as always, you may inspect the Shopware object properties for other useful things that you might need. Be careful about dumping entire objects though, as it they can sometimes be quite big. E.g:

created() {
    console.log(Shopware);
}