Dojo Toolkit中的代碼重用

Question

我正在使用Dojo Toolkit實現移動應用程序。該應用程序有幾個頁面，所有頁面都有相同的TabBar。目前，TabBar在每個頁面都被硬編碼。所以如果想進行更改，我需要在每個頁面中更改TabBar。我如何使用Dojo Toolkit解決這個問題？

Answer 1

使用dojo.declare，創建由TabBar擴展的自定義小部件。然後在您的初始化代碼中，需要該模塊並在您的標記代碼中將dojoType設置爲您的自定義模塊名稱。一些與此類似：

require([ 
    "dojox/mobile/TabBar", 
    "dojox/mobile/TabBarButton" 
    ], function (TabBar, Button) { 

    dojo.declare("myTabBar", [ TabBar ], { 

     buildRendering: function() { 
      this.inherited(arguments); // call parent 
      // add a number of children 
      this.addChild(new Button({ 
       icon1: 'path/to/image', 
       icon1: 'path/to/hoverimage', 
       label: 'clickme', 
       moveTo:"view1" 
      })); 
     } 
    }); 
}); 

而是在你的代碼的UL/LI HTML標記，只需添加：

<div dojoType="myTabBar"></div> 

運行示例：http://jsfiddle.net/8sD6A/