doh Hello World模板化小部件，mixin的ContentPane

我正在嘗試運行示例doh測試用例。我正在測試一個來自dijit/layout/ContentPane的mixins的模板化小部件。doh Hello World模板化小部件，mixin的ContentPane

沒有錯誤正在被拋出......組件根本不呈現。模板文件正在被加載，因爲我可以在螢火蟲的net標籤中看到它，但它就像沒有「附加」到模板化的小部件。當我刪除ContentPane mixin時，事情按預期工作。

我們的項目使用ContentPane在許多地方混入我們的模板化小部件，因此我們可以將小部件當作佈局小部件。只有在嘗試使用doh加載時纔會出現此問題。

我們試圖加載的插件：

define([ 
    'dijit/layout/ContentPane', 
    'dijit/_WidgetsInTemplateMixin', 
    'dijit/_TemplatedMixin', 
    'dijit/_WidgetBase', 
    'dojo/_base/declare', 
    'dojo/text!./about.html' 
    ], function(ContentPane, WidgetsInTemplateMixin, TemplatedMixin, WidgetBase, declare, about) { 
    return declare([ContentPane, TemplatedMixin, WidgetsInTemplateMixin], { 
     templateString: about, 

     constructor: function() { 
      this.inherited(arguments); 
     }, 

     startup: function() { 
      this.inherited(arguments); 
     } 
    }); 
});

模板：

<div> 
    <div> 
     <h1>foo</h1> 
    </div> 
</div>

衛生部測試運行頁：

<body class="claro"> 
    <div style="height: 100%"> 
    <div id="mainContainer" 
     style="height: 100%; width: 100%" 
     data-dojo-type="dijit/layout/BorderContainer"> 
     <div data-dojo-type="dijit/layout/ContentPane" 
      data-dojo-props="region: 'center'"> 
      <div data-dojo-type="testPackage/widgets/About/About" 
       style="width: 100px; height: 100px; background-color: green"> 
      </div> 
     </div> 
    </div> 
    </div> 

    <script type="text/javascript"> 
     require([ 
      'dojo/ready', 
      'dojo/parser', 
      'dojo/dom-style', 
      'dojo/query', 
      'dojo', 
      'doh' 
     ], function(ready, parser, domStyle, query, dojo, doh){ 
      ready(function() { 
       parser.parse(); 

       doh.register("t", [ 
         function setup(t){ 
          var d = new doh.Deferred(); 

          d.callback(true); 
          return d; 
         } 
        ] 
       ); 
       doh.run(); 
      }); 
     }); 
    </script> 
</body>

中的「富」文本模板html文件未顯示

來源

2013-07-11 Jonathan.Brink

「所以我們可以把我們的小部件的佈局控件」 ......

你應該MIXIN的dijit/_LayoutWidget代替的dijit /佈局/ contentPane的，如果你想要得到的是佈局的功能。

所以，你的widget將成爲：

define([ 
    'dijit/layout/_LayoutWidget', 
    'dijit/_WidgetsInTemplateMixin', 
    'dijit/_TemplatedMixin', 
    'dojo/_base/declare', 
    'dojo/text!./about.html', 
    'dojo/domReady!' 
], function(ContentPane, _WidgetsInTemplateMixin, _TemplatedMixin, declare, about) { 
    return declare([_LayoutWidget, _TemplatedMixin, _WidgetsInTemplateMixin], { 

     templateString: about, 

     // ... 
    }); 
});

來源

2013-07-12 14:10:04 Philippe

感謝菲利普，我現在測試工作。當我們在應用程序中從ContentPane中「擴展」時，它工作得很好，但不能與doh一起使用。我明白，從現在開始，我應該從LayoutWidget擴展，但是您偶然知道爲什麼使用ContentPane可以在應用程序中工作，而不是在何時由Doh運行？ –

嗯...我不知道。將不得不深入代碼... – Philippe

這可能是因爲您的模板不包含「data-dojo-attach-point ='containerNode'」節點。 ContentPane需要一個。這就是通過窗格的「內容」屬性設置的內容去的地方。例如，在這個小提琴中：http://jsfiddle.net/psoares/5mRKE/，如果你從模板中移除了containerNode，那麼這個小部件將不能正確渲染......在dijit/_WidgetBase中，它說「containerNode必須是爲接受innerHTML的任何小部件（如ContentPane或BorderContainer或甚至Button）定義，而對於不像TextBox的小部件則相反。 – Philippe

doh Hello World模板化小部件，mixin的ContentPane

回答

相關問題