Подключаем компонент Locale Picker
Код переключателя языков С jQuery у меня выглядел вот так:
{% for code, name in locales %}
<a
href="#"
data-request="onSwitchLocale"
data-request-data="locale: '{{ code }}'"
>
{{ name }}
</a>
{% endfor %}
Но мы же хотим избавиться от jQuery 🙂
Устанавливаем https://github.com/oc-shopaholic/oc-request
Так выглядит мой переключатель языков БЕЗ jQuery:
<div class="language-menu">
{% for code, name in locales %}
<a href="#" data-locale="{{ code }}">{{ name }}</a>
{% endfor %}
</div>
Обратите внимание на название класса в родительском div "language-menu" и data атрибут data-locale, к ним мы будем цепляться в нашем js.
В js файл пишем:
import request from 'oc-request';
document.querySelector(".language-menu").addEventListener("click", (e) => {
request.sendData('onSwitchLocale', {
data: {
locale: e.target.dataset.locale
},
});
});
Расово верный переключатель языков без jquery готов 🙂