ListView、FormView 和 PageView 之间有什么区别?在 JScript 中用于 (ODOO | OpenERP)

What is the difference bettween ListView, FormView, and PageView? in JScript for (ODOO | OpenERP)

ListViewFormViewPageViewopenerp.web.XXXXXXXX.include({...有什么区别?还有更多吗?我一直在尝试为ODOO学习JS,但是官方文档很差或不准确,我真的很想知道如何正确使用它们?还有多少?,如果您能分享有关此主题的指南,那就太好了。感谢您的宝贵时间!

基本上,您可以从 Odoo documentation.

中学习具有所有可能属性及其子元素的视图概念

表格

表单视图用于显示单个记录中的数据。它们的根元素是<form>。它们由常规 HTML 和额外的结构和语义组件组成。

  • 一次处理一条记录。
  • 可以包含其他结构组件(如笔记本,sheet)。
  • 没有排序和搜索的范围,因为目前只有一条记录。

列表

列表视图的根元素是 <tree>。列表视图的根可以具有以下属性:

  • 在树中显示记录集。
  • 不能包含任何结构组件。
  • 可以进行搜索和排序。

odoo中的每个视图都有javascript个文件,您可以从WEB模块中引用它。

  • Web/static/src/js/view_form.js
  • Web/static/src/js/view_list.js
  • Web/static/src/js/view_list_editable.js
  • Web/static/src/js/view_tree.js

等辅助功能sidebar,xml_to_json,xml_to_strjson_node_to_xmlfields_view_get 以及 [=159= 中的许多其他内容].

页面是结构组件,因此它包含在表单视图中。

Javascript WEB模块结构

JavaScript模块主要基于这三个概念构建。

  1. Classes
  2. Widgets
  3. The QWeb Template Engine

:

与模块一样,与大多数面向对象的语言相反,javascript 不构建在 classes 中,尽管它提供了大致相同的(如果较低级别和更冗长的)机制。 为了简单和对开发人员友好,Odoo web 提供了一个基于 Javascript Inheritance.

的 class 系统

小部件 :

Odoo 网络客户端捆绑 jQuery 以便于 DOM 操作。它很有用,并提供了比标准 W3C DOM2 更好的 API,但不足以构建导致难以维护的复杂应用程序。

与面向对象的桌面 UI 工具包(例如 Qt、Cocoa 或 GTK)非常相似,Odoo Web 使特定组件负责页面的各个部分。在 Odoo web 中,此类组件的基础是 Widget() class,一个专门处理页面部分并为用户显示信息的组件。

QWeb 模板引擎 :

这允许生成和显示任何类型的内容,但在生成大量 DOM(大量重复、引用问题...)时变得笨拙

与许多其他环境一样,Odoo 的解决方案是使用 template engine. Odoo's template engine is called QWeb.

QWeb 是一种基于 XML 的模板语言:

  • 在 JavaScript 中完全实现并在浏览器中呈现
  • 每个模板文件(XML 个文件)包含多个模板
  • 在Odoo Web的Widget()中有特殊支持,虽然可以使用 在 Odoo 的网络客户端之外(并且可以使用 Widget() 不依赖 QWeb)

示例:(获取视图的每页记录数,默认为80,您可以通过覆盖此方法来更新它))

完成这种任务主要有两件事。

  1. Adding/updating方法根据需要。
  2. 将创建的文件添加到适当的模板。

为 javascript 文件添加此功能,并使用模板继承将此文件添加到 web_backend 资产中,然后此代码的效果将自动出现。

instance.web.ListView.include({
    limit : function(){
        if (this._limit === undefined) {
            this._limit = (this.options.limit
            || this.defaults.limit
            || (this.getParent().action || {}).limit
            || 160);
        }
        return this._limit;
    },
});

Xml代码:

<template id="assets" inherit_id="web.assets_backend">
      <xpath expr="//script[@src='/web/static/src/js/view_tree.js']" position="after">
              <script type="text/javascript" src="your script file path"></script>
      </xpath>
 </template>

安装您的模块并查看效果,与使用 javascript 继承实现任何功能的方式相同。