Я знаю несколько человеческих языков, один из них — английский, но на самом деле мой родной язык — иврит.
Мне нужно написать пользовательский интерфейс, который может поддерживать два или более языков одновременно.
В качестве пользовательского интерфейса я выбираю Vue.
Но дело не только в переводе текста. Это на самом деле легкая и простая часть.
Иврит, как и арабский, имеет раскладку справа налево, в то время как большинство других человеческих языков пишут слева направо и имеют раскладку слева направо.
Если мне нужно поддерживать и иврит, и английский язык на одном уровне в одной и той же раскладке, мне нужна поддержка раскладки BiDi (двунаправленная), которая может правильно отображать иврит, а также английские и арабские цифры (то есть 0 ..9, в то время как арабский язык на самом деле поддерживает индуистские числа, но это совсем другой пост в блоге).
Проблема
Вот проблема, с которой я столкнулся:
В английском переводе расположение должно быть слева направо.
На иврите это должно быть справа налево.
Как я могу поддерживать пользовательский интерфейс, который меняет свой макет?
У Vue нет решения для этого :/
Причина «отсутствия» поддержки со стороны Vue заключается в том, что Vue фокусируется на содержании, а не на макете.
Вот почему Vue прикрепляется к месту содержимого, а не ко всему документу.
Как я это решил?
Я сломал свое решение, чтобы иметь что-то осязаемое.
Я создал небольшой пример, который объясняет мое решение.
Важно: я не запускал это конкретное решение, потому что я извлек его из более крупного проекта, над которым работаю, но это ядро, поэтому оно должно работать.
Я немного схитрил и использовал известную часть «id» для пустой ссылки stylesheet.
В компоненте представления, который обрабатывает выбор языка, я использовал «старую добрую функцию getDocumentById», чтобы найти пустой «id», и назначьте там (или удалите оттуда) правильную таблицу стилей в зависимости от нужного направления.
Я надеюсь, что этот пост поможет другим (или, если есть лучшие способы, я буду более чем счастлив узнать о них).
