Skip to content

🦉 环境(Environment)🦉

概览

Environment(环境)是一个在组件树中共享的对象。 它本身并不被 Owl 使用,但对应用开发者来说非常有用,因为它为组件之间提供了一种简洁的通信方式(除了 props 之外)。

比如在下面的组件结构中:

    Root
    /  \
   A    B

env 是传递给 App 的对象,会自动赋值给所有组件实例的 env 属性。

此外,应用启动时,传入的 env 对象会被冻结(shallow freeze), 这样可以简化运行时的心智模型。注意:只进行浅冻结,子对象仍可修改。


设置环境

设置环境的正确方式,是在创建 App 实例时传入:

js
const env = {
    _t: myTranslateFunction,
    user: { ... },
    services: {
        // ...
    },
};

new App(Root, { env }).mount(document.body);

// 或者使用简写形式:
mount(App, document.body, { env });

使用子环境(Sub Environment)

有时,我们希望只为某个组件及其子组件添加额外的 env 键。 这时不能通过上面的方法(那是设置全局环境),而应使用两个钩子函数之一:

js
class SomeComponent extends Component {
  setup() {
    useSubEnv({ myKey: someValue }); // 所有子组件都能访问 myKey
  }
}

环境的内容建议

env 中的内容完全由应用开发者决定,但通常可以放置:

  • 一些全局配置项;
  • 会话(session)信息;
  • 通用服务(如 RPC 调用、权限检查等);
  • 实用工具函数(如翻译函数 _t)等。

使用 env 的最大好处是:组件更容易测试。 我们可以为测试创建一个模拟环境,注入 mock 服务,无需修改组件代码。

本站内容仅供学习与参考