Odoo10 Javascript小部件操作不工作：ClientWidget不是函数

我仍在学习如何正确添加自己的javascript代码。我正在尝试将我自己的东西添加到Odoo后端

我仔细阅读了《Building Interface Extensions》指南（），但它非常不准确或完全过时

在查看了Odoo官方模块（如Account、Project、CRM）之后，我编写了如下代码：

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

var core = require('web.core');
var _t = core._t;
var _lt = core._lt;
var Widget = require('web.Widget');
var QWeb = core.qweb;

var Explorer = Widget.extend({
    init: function(parent, options) {
        console.log('Explorer inited');
    },
    start: function() {
        console.log('Explorer started');
    },
});

/* NONE OF THESE WORK OK */
//core.view_registry.add('exploreraction', Explorer);
//core.action_registry.add('exploreraction', function() { return new Explorer(); });
core.action_registry.add('exploreraction', 'rhp.main.Explorer');
//odoo.client_actions.add('exploreraction', Explorer);

/* "Main loaded" is successfully printed in console */
console.log("Main loaded");

return {
    Explorer: Explorer,
};

});

我的模块xml数据：

<record id="explorer_action" model="ir.actions.client">
    <field name="name">Document Explorer</field>
    <field name="tag">exploreraction</field>
    <field name="target">main</field>
</record>

<menuitem name="Documents" id="main_docs" />
<menuitem name="Document Explorer" id="rhp_explorer" parent="rhp.main_docs" action="rhp.explorer_action"/>

回溯粘贴在这里

========================================================================

编辑：

我添加了模板，如Vishal Khichadiya的示例：

<t t-name="exploreraction" >
    <div id="exploreraction_div">
        test
    </div>
</t>

现在，当我导航到我的菜单项时，我发现以下错误：

TypeError: this.__getterSetterInternalMap is undefined

---

这里的新回溯：

您需要自行设计模板

您将在OdooItSelf中找到创建模板的参考代码

在清单文件中将模板文件添加为'qweb'：[“static/src/xml/my_template.xml”]

示例A模板代码：

<t t-name="exploreraction" >
    <div id="my_temp_id">
    <div class="ex_button">
        <div class="cancle_btn">
            <button class="btn btn-danger">Cancle</button>
        </div>
        <div class="Add_btn">
            <button class="btn btn-success">Add </button>
        </div>
    </div>
    </div>
</t>

癌变
添加

使用其他xml文件创建assets\u backend.xml

/查看/assets\u backend.xml -->这里需要添加javasscript文件路径

 <?xml version="1.0"?>
 <odoo>
   <data>
    <template id="assets_backend" inherit_id="web.assets_backend">
        <xpath expr="script[last()]" position="after">

            <script type="text/javascript" src="/static/src/js/rhp_main.js"></script>
        </xpath>
    </template>
    <template id="assets_common" inherit_id="web.assets_common">
        <xpath expr="script[last()]" position="after">

        </xpath>
    </template>
  </data>
 </odoo>

---

您需要自行设计模板

您将在OdooItSelf中找到创建模板的参考代码

在清单文件中将模板文件添加为'qweb'：[“static/src/xml/my_template.xml”]

示例A模板代码：

<t t-name="exploreraction" >
    <div id="my_temp_id">
    <div class="ex_button">
        <div class="cancle_btn">
            <button class="btn btn-danger">Cancle</button>
        </div>
        <div class="Add_btn">
            <button class="btn btn-success">Add </button>
        </div>
    </div>
    </div>
</t>

癌变
添加

使用其他xml文件创建assets\u backend.xml

/查看/assets\u backend.xml -->这里需要添加javasscript文件路径

 <?xml version="1.0"?>
 <odoo>
   <data>
    <template id="assets_backend" inherit_id="web.assets_backend">
        <xpath expr="script[last()]" position="after">

            <script type="text/javascript" src="/static/src/js/rhp_main.js"></script>
        </xpath>
    </template>
    <template id="assets_common" inherit_id="web.assets_common">
        <xpath expr="script[last()]" position="after">

        </xpath>
    </template>
  </data>
 </odoo>

---

我对Odoo和JS也是新手，我尝试了一些东西，如下所示：

    In your /static/src/js/your_.js file, add the code:

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

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


    var HomePage = Widget.extend({
       template: "HelloJS",

       init: function(parent) {
            this._super(parent);
            console.log("Hello JS, I'm inside of init.");
       },


    start: function() {
            console.log("Hello JS, I'm inside of start.");
     },
   });

   core.action_registry.add('HelloJS', HomePage);

   return HomePage;
   }); 

在/static/src/xml/your.xml文件中：

    <?xml version="1.0"  encoding="UTF-8"?>
    <templates xml:space="preserve">
       <t t-name="HelloJS">
          <div> </div>
       </t>
    </templates>

   <?xml version="1.0" encoding="UTF-8"?>
    <odoo>
      <data>

    <template id="assets_backend" name="petstore" 
        inherit_id="web.assets_backend">
        <xpath expr="." position="inside">
            <script type="text/javascript"         
            src="/your_module_name/static/src/js/your_js_file.js">
            </script>
        </xpath>
    </template> 

    <record id="hellojs_id" model="ir.actions.client">
        <field name="name">HelloJS</field>
        <field name="tag">HelloJS</field>
    </record>
     <menuitem id="hellojs_menu" 
            name="HelloJS" 
            action="hellojs_id"/>
     </data>
     </odoo>

---

它会起作用的。请试一试。

我对Odoo和JS也是新手，我已经尝试了一些东西，如下所示：

    In your /static/src/js/your_.js file, add the code:

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

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


    var HomePage = Widget.extend({
       template: "HelloJS",

       init: function(parent) {
            this._super(parent);
            console.log("Hello JS, I'm inside of init.");
       },


    start: function() {
            console.log("Hello JS, I'm inside of start.");
     },
   });

   core.action_registry.add('HelloJS', HomePage);

   return HomePage;
   }); 

在/static/src/xml/your.xml文件中：

    <?xml version="1.0"  encoding="UTF-8"?>
    <templates xml:space="preserve">
       <t t-name="HelloJS">
          <div> </div>
       </t>
    </templates>

   <?xml version="1.0" encoding="UTF-8"?>
    <odoo>
      <data>

    <template id="assets_backend" name="petstore" 
        inherit_id="web.assets_backend">
        <xpath expr="." position="inside">
            <script type="text/javascript"         
            src="/your_module_name/static/src/js/your_js_file.js">
            </script>
        </xpath>
    </template> 

    <record id="hellojs_id" model="ir.actions.client">
        <field name="name">HelloJS</field>
        <field name="tag">HelloJS</field>
    </record>
     <menuitem id="hellojs_menu" 
            name="HelloJS" 
            action="hellojs_id"/>
     </data>
     </odoo>

它会起作用的。请试一试。

我不熟悉，我有解决办法。它会很好用的

Create your js file in /module_name/static/src/js/your_js_file.js and 
add the following code :


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

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

     var ProductsWidget = Widget.extend({
         template: "ProductsWidget",
         init: function(parent, products, color) {
         this._super(parent);
         this.products = products;
         this.color = color;
    },
  });

  var HomePage = Widget.extend({

    start: function() {
        var products = new ProductsWidget(
            this, ["cpu", "mouse", "keyboard", "graphic card", 
                  "screen"], "#00FF00");
        products.appendTo(this.$el);
      },    
    });
    core.action_registry.add('ProductsWidget', HomePage); 
   }); 

在/module_name/static/src/xml/your_xml_file.xml中创建xml文件，并添加以下代码：

   <?xml version="1.0"  encoding="UTF-8"?>
     <templates xml:space="preserve">
       <t t-name="ProductsWidget">
         <div>
            <t t-foreach="widget.products" t-as="product">
               <span class="oe_products_item"
                  t-attf-style="background-color: {{ widget.color 
                 }};">
                <t t-esc="product"/>
                </span>
              <br/>
            </t>
         </div>
        </t>
     </templates>

     .oe_products_item {
     display: inline-block;
     padding: 3px;
     margin: 5px;
     border: 1px solid black;
     border-radius: 3px;
     }

在/module_name/views/your_xml_file.xml中创建视图的xml文件，并添加以下代码：

   <?xml version="1.0" encoding="UTF-8"?>
    <odoo>
      <data>
        <template id="assets_backend" name="give_name" 
           inherit_id="web.assets_backend">
          <xpath expr="." position="inside">
           <script type="text/javascript" 
             src="/module_name/static/src/js/your_js_file_name.js">
           </script>
           <link href="/module_name/static/src/css/your_css_file.css" 
             rel="stylesheet"></link>
           </xpath>
         </template>
         <record id="template_id" model="ir.actions.client">
            <field name="name">ProductsWidget</field>
            <field name="tag">ProductsWidget</field>
        </record>
        <menuitem id="home_page_menu" 
            name="Home Page"
            action="template_id"/>  
       </data>
      </odoo>

我不熟悉，我有解决办法。它会很好用的

Create your js file in /module_name/static/src/js/your_js_file.js and 
add the following code :


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

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

     var ProductsWidget = Widget.extend({
         template: "ProductsWidget",
         init: function(parent, products, color) {
         this._super(parent);
         this.products = products;
         this.color = color;
    },
  });

  var HomePage = Widget.extend({

    start: function() {
        var products = new ProductsWidget(
            this, ["cpu", "mouse", "keyboard", "graphic card", 
                  "screen"], "#00FF00");
        products.appendTo(this.$el);
      },    
    });
    core.action_registry.add('ProductsWidget', HomePage); 
   }); 

在/module_name/static/src/xml/your_xml_file.xml中创建xml文件，并添加以下代码：

   <?xml version="1.0"  encoding="UTF-8"?>
     <templates xml:space="preserve">
       <t t-name="ProductsWidget">
         <div>
            <t t-foreach="widget.products" t-as="product">
               <span class="oe_products_item"
                  t-attf-style="background-color: {{ widget.color 
                 }};">
                <t t-esc="product"/>
                </span>
              <br/>
            </t>
         </div>
        </t>
     </templates>

     .oe_products_item {
     display: inline-block;
     padding: 3px;
     margin: 5px;
     border: 1px solid black;
     border-radius: 3px;
     }

在/module_name/views/your_xml_file.xml中创建视图的xml文件，并添加以下代码：

   <?xml version="1.0" encoding="UTF-8"?>
    <odoo>
      <data>
        <template id="assets_backend" name="give_name" 
           inherit_id="web.assets_backend">
          <xpath expr="." position="inside">
           <script type="text/javascript" 
             src="/module_name/static/src/js/your_js_file_name.js">
           </script>
           <link href="/module_name/static/src/css/your_css_file.css" 
             rel="stylesheet"></link>
           </xpath>
         </template>
         <record id="template_id" model="ir.actions.client">
            <field name="name">ProductsWidget</field>
            <field name="tag">ProductsWidget</field>
        </record>
        <menuitem id="home_page_menu" 
            name="Home Page"
            action="template_id"/>  
       </data>
      </odoo>

---

---

我没有得到你想要的东西？@VikiChavada我想创建一个类似javascript文件浏览器的界面，并在Odoo后端使用它。但基本上，我的问题是，我引用的官方文档（petstore）是完全错误的，就我所关注的而言。无论如何，我很乐意在Odoo10中获得类似OpenERP7视图/小部件/或任何东西。如图所示：我没有得到你想要的东西？@VikiChavada我想创建一个类似javascript文件浏览器的界面，并在Odoo后端使用它。但基本上，我的问题是，我引用的官方文档（petstore）是完全错误的，就我所关注的而言。无论如何，我很乐意在Odoo10中获得类似OpenERP7视图/小部件/或任何东西。见图：我不明白你的答案。你能提供一些参考吗？哪部分你不了解？我需要给你们提供一些参考代码吗？“参考”就像是你们提供的信息的来源。此外，您还提到了一些“模板”，并且在添加操作时应该指定它，但是您的代码中没有显示这一点。如果我复制粘贴您的代码，它仍将失败..：（你可以参考：@KevalMehta如果我从这一切中学到了什么，那就是Odoo文档是不可信的。如果你太相信它，你会浪费几天的开发时间：）我不明白你的答案。你能提供一些参考吗？哪部分你不了解？我需要给你们提供一些参考代码吗？“参考”就像是你们提供的信息的来源。此外，您还提到了一些“模板”，并且在添加操作时应该指定它，但是您的代码中没有显示这一点。如果我复制粘贴您的代码，它仍将失败..：（你可以参考：@KevalMehta如果我从这一切中学到了什么，那就是Odoo文档是不可信的。如果你太相信它，你会失去几天的开发时间：）对不起。。你得等23个小时才能拿到赏金。再次感谢，先生@user568021我也为此添加了一个解决方案。请看一看。谢谢。：）很抱歉你得等23个小时才能拿到赏金。再次感谢，先生@user568021我也为此添加了一个解决方案。请看一看。谢谢。：）为什么不编辑你的第一个答案呢？我已经把那个标记为“正确”。看起来你是新来的..@user568021这也是正确的程序。我在回答后读了评论。很抱歉因为我是新来的。为什么不编辑你的第一个答案呢？我已经把那个标记为“正确”。看起来你是新来的..@user568021这也是正确的程序。我在回答后读了评论。很抱歉因为我是新来的。