openerp所用QWEB2的调试笔记
【1】 调式qweb模板时, 可以脱离openerp环境
阅读一下openerp目录 qweb目录中的几个html文件,可以作为起步
在浏览器下, 可以这样运行这些文件
http://127.0.0.1:8069/web/static/lib/qweb/qweb-benchmark.html
http://127.0.0.1:8069/web/static/lib/qweb/qweb-test.js.html
【2】qweb模板的格式如果不符合xml规范, 浏览器显示空白, 浏览器的控制台中会显示如下提示
Uncaught Error: QWeb2: This page contains the following errors:error on line xxx at column yyy:
然后是具体的错误原因。比如
Opening and ending tag mismatch: aaa line nnn and bbb
Specification mandate value for attribute ccc
【3】在模板中增加如下指令, 可在浏览器的控制台上输出变量内容
〈t t-log="变量名称" />
当使用多个t-log时, 控制台中输出的变量内容会引起混淆, 这时可再增加如下语句
〈t t-log=" '变量名称的说明' " />
【4】在模板中增加如下指令, 可在qweb的编译模板过程中进入断点语句,
〈t t-debug="随便什么东东" />
这时, 我们可以在控制台的源码页签中看到编译的中间过程,
在控制台下, 使用console.log(dict) 可以看到传入的所有参数
使用console.log(r) 可以看到输出中间结果
官方文档上 介绍的使用方法 〈t t-debug /> ,如果后面不随便添加些什么东东, 会出现如下错误
Specification mandate value for attribute t-debug
【5】模板文件示例 (在qweb目录下, 文件名为 laoliu.xml)
如下是官网上web文档中的例子, 增加了t-log和t-debug语句
〈templates> 〈div t-name="example_template" t-attf-class="base #{cls}"> 〈t t-log="'in example_template, value of [items]:'" /> 〈t t-log="items" /> 〈h4 t-if="title"> 〈t t-esc="title"/> 〈/h4> 〈ul> 〈li t-foreach="items" t-as="item" t-att-class="item_parity"> 〈t t-call="example_template.sub"> 〈t t-set="arg" t-value="item_value"/> 〈/t> 〈/li> 〈/ul> 〈t t-debug="随便什么东东" /> 〈/div> 〈t t-name="example_template.sub"> 〈t t-log="'in example_template.sub, value of [arg]:'" /> 〈t t-log="arg" /> 〈t t-esc="arg.name"/> 〈dl> 〈t t-foreach="arg.tags" t-as="tag" t-if="tag_index lt 5"> 〈dt> 〈t t-esc="tag"/> 〈/dt> 〈dd> 〈t t-esc="tag_value"/> 〈/dd> 〈/t> 〈/dl> 〈/t> 〈/templates>
【6】 程序示例 (在qweb目录下, 文件名为 laoliu.html)
访问方法:http://127.0.0.1:8069/web/static/lib/qweb/laoliu.html
〈!doctype html> 〈html> 〈head> 〈script src="../jquery/jquery-1.8.3.js"> 〈/script> 〈script type="text/javascript" src="qweb2.js"> 〈/script> 〈script> var laoliu_data={ "class1": "foo", "title": "Random Title", "items": [ { "name": "foo", "tags": {"bar": "baz", "qux": "quux"} }, { "name": "Lorem", "tags": { "ipsum": "dolor", "sit": "amet", "consectetur": "adipiscing", "elit": "Sed", "hendrerit": "ullamcorper", "ante": "id", "vestibulum": "Lorem", "ipsum": "dolor", "sit": "amet" } } ] }; QWeb = new QWeb2.Engine(); QWeb.debug = true; QWeb.add_template('laoliu.xml'); template='laoliu.xml'; result=QWeb.render('example_template', laoliu_data ); $(document).ready(function () { $('.placeholder').append(result); }); 〈/script> 〈/head> 〈body> 〈div class="placeholder"> 〈/div> 〈/body> 〈/html>
【7】t-debug的运行结果
(function(dict ) { var context = { engine : this, template : 'example_template' }; dict = dict || {}; dict['__template__'] = 'example_template'; var r = []; r.push(' 〈div'); r.push(context.engine.tools.gen_attribute(['class', ('base ' + (dict['cls']))])); r.push('> ', 'n '); console.log('in example_template, value of [items]:'); r.push('n '); console.log(dict['items']); r.push('n '); if (dict['title']) { r.push(' 〈h4> '); r.push(context.engine.tools.html_escape(dict['title'])); r.push(' 〈/h4> '); } r.push('n 〈ul> ', 'n '); context.engine.tools.foreach(context, dict['items'], 'item', dict, function(context, dict) { r.push(' 〈li'); r.push(context.engine.tools.gen_attribute(['class', (dict['item_parity'])])); r.push('> ', 'n '); r.push(context.engine.tools.call(context, 'example_template.sub', dict, '', function(context, dict) { var r = []; r.push('n '); dict['arg'] = (dict['item_value']); r.push('n '); return r.join(''); })); r.push('n 〈/li> '); }); r.push('n 〈/ul> ', 'n '); debugger; r.push('n 〈/div> '); return r.join(''); })
相关文章
- Apollo星火计划学习笔记——参考线平滑算法解析及实现(以U型弯道场景仿真调试为例)
- Android调试自测工具 (Hugo、Timber、Scalpel)
- vs2015调试慢
- Linux入门第五天——shell脚本入门(下)基础语法之调试debug
- 24L01/SI24R1调试笔记
- Android系统级深入开发——移植与调试
- ESP8266调试笔记
- set -x 调试shell
- SQL Server 2008下轻松调试T-SQL语句和存储过程
- Debug - 支持浏览器和 Node 平台的全端调试工具
- 红米手机真机调试问题记录
- ASP.NET性能调试
- gdb 调试技巧:定位程序卡死问题
- 2019-10-10-优雅调试-REST-API-的工具
- visual Studio 无法调试,提示程序跟踪已退出
- 吴恩达深度学习网课 通俗版笔记——(02.改善深层神经网络)第三周 超参数调试、Batch正则化和程序框架
- iOS开发之—XCODE真机调试设备连接一直忙碌如何处理!(真机调试各种错误提示解决)
- VC调试技巧
- Android系统移植与调试之------->如何修改Android设备添加重启、飞行模式、静音模式等功能(二)