zoukankan      html  css  js  c++  java
  • 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('');
    })
  • 相关阅读:
    类加载器
    java类的主动使用方式
    Java类装载器和命名空间
    cas改造
    所有jar文件列出工具
    源码阅读工具_解析所有类的使用情况
    web(s,哈哈,w,没有,d,用处,f)web框架引用类的次数
    struts2类型转换器StrutsTypeConverter的使用
    struts2的验证框架的使用和扩展
    Python3连接MySQL
  • 原文地址:https://www.cnblogs.com/chjbbs/p/5044409.html
Copyright © 2011-2022 走看看