微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

小部件呈现后,Odoo执行javascript库

如何解决小部件呈现后,Odoo执行javascript库

我有一个odoo小部件,我试图在其中绘制图表(使用外部javascript库)。到目前为止,我已经定义了模板,小部件,加载资产并注册了视图。

这是我的模板

<div t-name="my_template">
    <button class="clickme" type="button">Click Me!</button>
    <div id="chart"></div>
</div

这是我的渲染器定义:

odoo.define('MyRenderer',function (require) {
    "use strict";

    var Widget = require('web.Widget');
    var core = require('web.core');


    var MyRenderer = Widget.extend({
        template: 'my_template',events: {
            'click button.clickme': '_renderChart',},init: function (parent) {
            // insert code to execute before rendering,for object initialization
            this._super(parent);
            console.log('init renderer');
        },start: function () {
            // post-rendering initialization code,at this point
            // if ``start`` is asynchronous,return a promise object so callers
            // kNow when the object is done initializing
            var self = this;
            var defs = [this._super.apply(this,arguments)];
            console.log('start renderer');

            var def = self._renderChart();
            defs.push(def);
            return $.when.apply($,defs);
        },_renderChart: function () {
            var self = this;
            var domain = [];
            var args = [domain];

            return this._rpc({
                model: 'mymodel.test',method: 'areas_per_city',args: args,})
                .then(function (result) {
                    console.log(result);

                    var data = {
                        "resultset": result,"Metadata": [{
                            "colIndex": 0,"colType": "String","colName": "Type"
                        },{
                            "colIndex": 1,"colType": "Numeric","colName": "Quantity"
                        }]
                    };


                    new pvc.PieChart({
                        canvas: 'chart',height: 200,crosstabMode: false,valuesVisible: true,colors: [
                            '#333333','#777777','#FFC20F','#FFE085','#005CA7','#0086F4','#39A74A','#63CA73'
                        ],legend: true,legendPosition: 'right',legendalign: "center",animate: false,selectable: true,hoverable: true
                    })
                        .setData(data)
                        .render();
                });
        },});

    // registering view
    core.action_registry.add('my_custom_view',MyRenderer);


    return {
        MyRenderer: MyRenderer,};
}); 

当我单击菜单操作并使用开发人员工具时,我看到图表已呈现,但是当该操作完成加载时,它将替换模板内容并将其设置为空白。

我将click事件绑定到了按钮,并且效果很好。问题出在小部件的start()方法中。我不知道是否可以使用另一种方法。 预先感谢

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。