odoo16前端框架分析1 boot.js

2023-11-07 21:52

本文主要是介绍odoo16前端框架分析1 boot.js,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

odoo16前端框架分析1 boot.js

odoo16的前端基于owl组件系统,这是一个类似vue,react的现代js框架。
前端框架都放在了web模块中,具体的位置是addons/web/static/src
不过今天要说的不是owl,而是跟前端启动有关的几个重要文件

1、boot.js

从名字就能看出来,这个文件是一个启动文件。 odoo前端将所有的js打包成了两个文件,一个是common.js,另一个是backend.js, 而common.js 是最先加载的,而boot.js在common.js中又是最先加载的,可见它的重要性

odoo自定义了一个小型的模块系统,用于管理各odoo模块中的前端代码,并自行解决各代码之间的依赖关系。相关代码在addons/web/static/src/js/boot.js中,所以这个资源文件是需要第一个加载的文件。

boot.js在启动时,会创建一个全局的变量’odoo’,该变量有几个预设的函数,用于管理每个javascript模块。每个js模块其实就是一段代码,具有名称或者可能的依赖关系。

 if (!globalThis.odoo) {globalThis.odoo = {};}var odoo = globalThis.odoo;

这里定义了一个全局变量odoo,提一下globalThis,这是为了兼容node环境和浏览器环境而创造出的js环境下的顶层对象,在浏览器环境下跟window对象是一样的。

然后定义了odoo对象的一些属性和函数,我们最常见的就是odoo.define

 odoo.define = function () {var args = Array.prototype.slice.call(arguments);var name = typeof args[0] === "string" ? args.shift() : "__odoo_job" + jobUID++;var factory = args[args.length - 1];var deps;if (args[0] instanceof Array) {deps = args[0];} else {deps = [];factory.toString().replace(commentRegExp, "").replace(cjsRequireRegExp, function (match, dep) {deps.push(dep);});}if (!(deps instanceof Array)) {throw new Error("Dependencies should be defined by an array", deps);}if (typeof factory !== "function") {throw new Error("Factory should be defined by a function", factory);}if (typeof name !== "string") {throw new Error("Invalid name definition (should be a string", name);}if (name in factories) {throw new Error("Service " + name + " already defined");}factory.deps = deps;factories[name] = factory;let promiseResolve;const promise = new Promise((resolve) => {promiseResolve = resolve;});jobs.push({name: name,factory: factory,deps: deps,resolve: promiseResolve,promise: promise,});deps.forEach(function (dep) {jobDeps.push({ from: dep, to: name });});odoo.__DEBUG__.processJobs();};

这个函数是定义odoo前端模块的函数。它可以有两个或者三个参数

两个参数,在模块中定义依赖关系。

odoo.define('module.A', function (require) {"use strict";var A = ...;return A;});odoo.define('module.B', function (require) {"use strict";var A = require('module.A');var B = ...; // something that involves Areturn B;});

上面的odoo.define()用于标准的odoo定义前端js模块的函数,第一个参数表示这个模块的名称,如果后面没有其它地方继承此js模块,也可以不用取名。第二个参数是一个匿名函数,传入参数为require,这个函数就是实际的js业务代码。如果你想引用其它的js模块,可以通过require(‘module.A’)的语法引入。这里的require名称是固定的,不能改变。另外odoo.define()也提供了一种显式的依赖定义方法,如:

odoo.define('module.Something', ['module.A', 'module.B'], function (require) {"use strict";var A = require('module.A');var B = require('module.B');// some code});

从上面的实例中,我们可以看出odoo.define()函数有三个参数:

  • moduleName:javascript模块的名称。它应该是一个唯一的字符串。约定是odoo插件的名称,后跟一个特定的描述。例如"web.Widget"描述了在Web插件中定义的模块,该模块导出Widget类(因为首字母大写),如果名称不是唯一的,则将引发异常并将其显示在控制台中。如果你定义的时候,没有此参数,则系统会自动生成一个带时间戳的唯一名称;
  • dependencies:第二个参数是可选的。如果给出的话,它应该是一个字符串列表,每个字符串对应一个javascript模块名称。这描述了执行模块之前需要加载的依赖项。如果此处未明确给出依赖项,则模块系统将通过在函数上调用toString,然后使用正则表达式查找所有require语句,从函数中提取它们;
  • function:最后一个参数是定义模块的函数。它的返回值是模块的值,可以将其传递给需要它的其他模块。请注意,异步模块有一个小例外,下面会讲到。

在Odoo中,有可能模块在准备好之前需要执行一些工作。例如,它可以执行rpc加载一些数据。在这种情况下,模块简单地返回一个Promise。 这时,在注册模块之前模块系统将仅等待Promise完成。

参考 https://www.cnblogs.com/pythonClub/p/17305994.html

这篇关于odoo16前端框架分析1 boot.js的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/366501

相关文章

基于Python Playwright进行前端性能测试的脚本实现

《基于PythonPlaywright进行前端性能测试的脚本实现》在当今Web应用开发中,性能优化是提升用户体验的关键因素之一,本文将介绍如何使用Playwright构建一个自动化性能测试工具,希望... 目录引言工具概述整体架构核心实现解析1. 浏览器初始化2. 性能数据收集3. 资源分析4. 关键性能指

python使用Akshare与Streamlit实现股票估值分析教程(图文代码)

《python使用Akshare与Streamlit实现股票估值分析教程(图文代码)》入职测试中的一道题,要求:从Akshare下载某一个股票近十年的财务报表包括,资产负债表,利润表,现金流量表,保存... 目录一、前言二、核心知识点梳理1、Akshare数据获取2、Pandas数据处理3、Matplotl

分布式锁在Spring Boot应用中的实现过程

《分布式锁在SpringBoot应用中的实现过程》文章介绍在SpringBoot中通过自定义Lock注解、LockAspect切面和RedisLockUtils工具类实现分布式锁,确保多实例并发操作... 目录Lock注解LockASPect切面RedisLockUtils工具类总结在现代微服务架构中,分布

python panda库从基础到高级操作分析

《pythonpanda库从基础到高级操作分析》本文介绍了Pandas库的核心功能,包括处理结构化数据的Series和DataFrame数据结构,数据读取、清洗、分组聚合、合并、时间序列分析及大数据... 目录1. Pandas 概述2. 基本操作:数据读取与查看3. 索引操作:精准定位数据4. Group

Spring Boot集成/输出/日志级别控制/持久化开发实践

《SpringBoot集成/输出/日志级别控制/持久化开发实践》SpringBoot默认集成Logback,支持灵活日志级别配置(INFO/DEBUG等),输出包含时间戳、级别、类名等信息,并可通过... 目录一、日志概述1.1、Spring Boot日志简介1.2、日志框架与默认配置1.3、日志的核心作用

破茧 JDBC:MyBatis 在 Spring Boot 中的轻量实践指南

《破茧JDBC:MyBatis在SpringBoot中的轻量实践指南》MyBatis是持久层框架,简化JDBC开发,通过接口+XML/注解实现数据访问,动态代理生成实现类,支持增删改查及参数... 目录一、什么是 MyBATis二、 MyBatis 入门2.1、创建项目2.2、配置数据库连接字符串2.3、入

MySQL中EXISTS与IN用法使用与对比分析

《MySQL中EXISTS与IN用法使用与对比分析》在MySQL中,EXISTS和IN都用于子查询中根据另一个查询的结果来过滤主查询的记录,本文将基于工作原理、效率和应用场景进行全面对比... 目录一、基本用法详解1. IN 运算符2. EXISTS 运算符二、EXISTS 与 IN 的选择策略三、性能对比

Apache Ignite 与 Spring Boot 集成详细指南

《ApacheIgnite与SpringBoot集成详细指南》ApacheIgnite官方指南详解如何通过SpringBootStarter扩展实现自动配置,支持厚/轻客户端模式,简化Ign... 目录 一、背景:为什么需要这个集成? 二、两种集成方式(对应两种客户端模型) 三、方式一:自动配置 Thick

MySQL 内存使用率常用分析语句

《MySQL内存使用率常用分析语句》用户整理了MySQL内存占用过高的分析方法,涵盖操作系统层确认及数据库层bufferpool、内存模块差值、线程状态、performance_schema性能数据... 目录一、 OS层二、 DB层1. 全局情况2. 内存占js用详情最近连续遇到mysql内存占用过高导致

深度解析Nginx日志分析与499状态码问题解决

《深度解析Nginx日志分析与499状态码问题解决》在Web服务器运维和性能优化过程中,Nginx日志是排查问题的重要依据,本文将围绕Nginx日志分析、499状态码的成因、排查方法及解决方案展开讨论... 目录前言1. Nginx日志基础1.1 Nginx日志存放位置1.2 Nginx日志格式2. 499