Odoo树视图自定义按钮点击触发时出现类型错误求助

错误详情 #

UncaughtPromiseError > TypeError
Uncaught Promise > Cannot convert undefined or null to object

TypeError: Cannot convert undefined or null to object
    at Function.entries (<anonymous>)
    at Class._setDecorationClasses (http://localhost:8069/web/assets/510-ad51254/web.assets_backend.min.js:5485:169)
    at Class._renderBodyCell (http://localhost:8069/web/assets/510-ad51254/web.assets_backend.min.js:5453:39)
    at http://localhost:8069/web/assets/510-ad51254/web.assets_backend.min.js:5476:117
    at Array.map (<anonymous>)
    at Class._renderRow (http://localhost:8069/web/assets/510-ad51254/web.assets_backend.min.js:5476:80)
    at Class._renderRow (http://localhost:8069/web/assets/510-ad51254/web.assets_backend.min.js:5377:69)
    at Class._renderRow (http://localhost:8069/web/assets/417-d50faff/web.assets_common.min.js:4724:371)
    at Array.map (<anonymous>)
    at Class._renderRows (http://localhost:8069/web/assets/510-ad51254/web.assets_backend.min.js:5478:119)

自定义控制器代码（static/src/js/list_controller.js） #

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

    var ListController = require('web.ListController');
    var core = require('web.core');
    var _t = core._t;

    ListController.include({
        renderButtons: function () {
            var self = this;
            this._super.apply(this, arguments);
            if (this.modelName === 'service.master') {
                this.$buttons.find('.o_list_button_add').after(
                    $('<button>', {
                        class: 'btn btn-primary btn-sm o_list_button_upload_alkeba',
                        accesskey: 'f',
                        text: _t("Import CSV JS"),
                    }).click(function () {
                        self.$('input[type=file]').click();
                    })
                );
            }
        },
    });
    core.action_registry.add('component_creator.list_controller', ListController);
    // return the object.
    return ListController;
});

问题原因及修复方案 #

1. 错误根源：点击事件中调用的self.$('input[type=file]')是不存在的DOM元素，获取结果为null/undefined，触发点击时干扰了Odoo内部的视图渲染逻辑，导致报错。另外，额外注册ListController到action注册表是多余操作，会破坏原有控制器逻辑。

2. 修复后代码：

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

    var ListController = require('web.ListController');
    var core = require('web.core');
    var _t = core._t;

    ListController.include({
        renderButtons: function () {
            var self = this;
            this._super.apply(this, arguments);
            if (this.modelName === 'service.master') {
                // 添加隐藏的文件输入框
                this.$el.append($('<input>', {
                    type: 'file',
                    style: 'display:none',
                    accept: '.csv',
                    id: 'csv_import_input'
                }));
                
                this.$buttons.find('.o_list_button_add').after(
                    $('<button>', {
                        class: 'btn btn-primary btn-sm o_list_button_upload_alkeba',
                        accesskey: 'f',
                        text: _t("Import CSV JS"),
                    }).click(function () {
                        // 触发已存在的文件输入框点击事件
                        $('#csv_import_input').click();
                    })
                );

                // 可选：添加文件选择后的处理逻辑
                $('#csv_import_input').on('change', function(e) {
                    var file = e.target.files[0];
                    // 在此编写文件读取、上传等业务逻辑
                });
            }
        },
    });

    return ListController;
});

3. 额外注意：确保模块的manifest.py中已正确配置该JS文件的assets加载路径，否则自定义代码不会生效。

内容的提问来源于stack exchange，提问作者Andromeda