🦉 Окружение (Environment) 🦉
Содержание
- Введение
- Настройка окружения
- Использвоание дочернего окружения
- [Содержимое окружения](#Содержимое окружения)
- Специальные ключи
Введение
Окружение это объект который содержит экземпляр QWeb
. Однако
при создании корневого компонета за ним закрепляется окружение (см. ниже
для более подробной информации). Это окружение затем автоматически становится доступно
каждому дочернему компоненту (и доступно через свойство this.env
)
Root
/ \
A B
В этом случае все компоненты будут иметь доступ к одному экземпляру QWeb
.
Для внутреннего использования Owl требует, чтобы среда имела ключ qweb
,
который сопоставляется с экземпляром QWeb
. Это экземпляр
QWeb
, который будет использоваться для рендеринга каждого шаблона в этом
конкретном дереве компонентов. Обратите внимание, что если экземпляр QWeb
не указан, Owl просто сгенерирует его на лету.
Окружение в основном статично. Каждое приложение может свободно добавлять в него что угодно, что очень полезно, поскольку к этому может получить доступ каждый дочерний компонет.
Настройка окружения
Для выполнения приложения Owl требуется окружение. В нем есть важный ключ: экземпляр QWeb, который будет рендерить все шаблоны.
Всякий раз, когда монтируется корневой компонент App
, Owl настроит допустимую окружение,
выполнив следующие шаги:
- берет объект
env
, определенный вApp.env
(еслиenv
не был явно настроен, то вернет пустой объектenv
, определенный вComponent
) - если
env.qweb
не установлен, Owl создаст экземплярQWeb
.
Правильный способ настроить окружение — просто настроить его в корневом классе компонентов до того, как будет создан первый компонент:
const env = {
_t: myTranslateFunction,
user: {...},
services: {
...
},
};
mount(App, { target: document.body, env });
Этот подход можно применять для обмена окружением между корневыми компонентами, достаточно сделать примерно так:
Component.env = myEnv; // будет значением env по умолчанию для всех компнентов
Обратите внимание что это окружение является глобальным окружением owl для приложения. В следующей секции будет объяснено как расширить окружение для специфического дочернего компонента и его потомков.
Использвоание дочернего окружения
Иногда может быть полезно добавить один (или более) специальных ключа к окружению с точки зрения конкретного компонента и его дочерних элементов. В этом случае решение, представленное выше, не будет работать, так как оно устанавливает глобальную среду.
А вот и хук для текущей ситуации: useSubEnv
.
class FormComponent extends Component {
constructor(parent, props) {
super(parent, props);
useSubEnv({ myKey: someValue });
}
}
Содержимое окружения
Вот несколько хороших вариантов использования дополнительных ключей в окружении:
- ключи конфигурации,
- информация о сессии,
- общие сервисы (такие как выполнение rpcs).
Такой подход означает, что компоненты легко тестируются: мы можем просто создать тестовую среду с сервисами болванками.
Например:
async function myEnv() {
const templates = await loadTemplates();
const qweb = new QWeb({ templates });
const session = getSession();
return {
_t: myTranslateFunction,
session: session,
qweb: qweb,
services: {
localStorage: localStorage,
rpc: rpc,
},
debug: false,
inMobileMode: true,
};
}
async function start() {
const env = await myEnv();
mount(App, { target: document.body, env });
}
Специальные ключи
Owl добавляет два специальных ключа/значения, если они не предоставлены в среде:
экземпляр QWeb
и объект browser
:
qweb
будет установлен на пустой экземплярQWeb
. Это абсолютно необходимо для того, чтобы Owl могла отображать что угодно.браузер
: это объект, который содержит некоторые общие точки доступа к методам браузера с побочным эффектом. См. объект browser для получения дополнительной информации. Обратите внимание, что объект browser будет удален из окружения в Owl 2.0.