Bitrix Framework

$Bitrix.Loc.getMessage

Method returns language phrase by ID.

this.$Bitrix.Loc.getMessage(name: string, replacements?: {[key: string]: string}): string;

Parameters:

Use inside template:

In text interpolation format:

template: `
	UserId is {{ $Bitrix.Loc.getMessage('USER_ID') }}
`

In template parameters:

template: `
	<div :title="$Bitrix.Loc.getMessage('FD_LAST_SEEN_MORE_YEAR')">Hover me</div>
`

Please note: function supports a second parameter with replacements. When use method in template or calculated property, replacements will be reactive:

const Counter = {
	data()
	{
		return {
			counter: 0
		}
	},
	created()
	{
		setInterval(() => this.counter++, 1000);
	},
	// language=Vue
	template: `
		{{$Bitrix.Loc.getMessage('DEMO_COUNTER', {'#COUNTER#': this.counter})}}
	`
};

Use in component:

Access to functions inside the component is performed in the same manner as in any other variable: via this.. There are nuances of use, however, in the hook beforeCreate and specifics of use are indicated in chapter description.

created()
{
	const message = this.$Bitrix.Loc.getMessage('EXAMPLE_PHRASE');
}

beforeCreate()
{
	const message = this.$bitrix.Loc.getMessage('EXAMPLE_PHRASE');
}

computed: {
	counter()
	{
	    return this.$Bitrix.Loc.getMessage('DEMO_COUNTER', {'#COUNTER#': this.couter});
    }
}

$Bitrix.Loc.getMessages

Method for getting all language phrases, available within Vue application.

this.$Bitrix.Loc.getMessages(): object

$Bitrix.Loc.setMessage

This method can set language phrases for Vue application.

this.$Bitrix.Loc.setMessage(id: string | {[key: string]: string}, value?: string): void;

Parameters:

Possible variant for calling the method, when the function's first parameter passes the localization object in the format {key1: "value1", ...}

Example:

Access to functions inside the component is performed in the same manner as to any other variable - via this.. There are, however, nuances of use in the hook beforeCreate. You can find details in the chapter description.

beforeCreate()
{
    this.$bitrix.Loc.setMessage('DEMO_COUNTER', 'Counter: #COUNTER#');
	
    this.$bitrix.Loc.setMessage({
        DEMO_COUNTER: 'Счетчик: #COUNTER#',
        DEMO_PHRASE_2: 'Фраза 2',
    });
}

BitrixVue.getFilteredPhrases(phrasePrefix: string|Array<string>, phrases?: object|null): ReadonlyArray<any>;

import {BitrixVue} from 'ui.vue3';

const Component = {
	...
	computed: 
	{
		localize()
		{
			return BitrixVue.getFilteredPhrases('PREFIX_');
		}
	},
	...
	
	template: `
		{{ localize.PREFIX_PHRASE_1 }}
	`
};