Dojox/app：如何正確切換視圖？

我使用DojoX中/應用程序建立一個Web應用程序，和我的config.json文件看起來像這樣：Dojox/app：如何正確切換視圖？

{ 
    "id": "app", 
    "name": "app", 
    "description": "Example dojox/app based Worklight app", 
    "dependencies": [ 
     "commonapp/app", 
     "commonapp/BaseViewController", 
     "dojo/store/Memory", 
     "dojox/app/utils/mvcModel", 
     "dojox/mvc/EditStoreRefListController", 
     "dojo/store/Observable", 
     "dojox/mobile/Button" 
    ], 
    "controllers": [ 
    "dojox/app/controllers/Load", 
    "dojox/app/controllers/Transition", 
    "dojox/app/controllers/Layout", 
    "dojox/app/controllers/HistoryHash"], 

    "stores": { 

    }, 
    "models": { 

    }, 

    "defaultView": "MainTemplate", 
    "defaultTransition": "slide", 
    "views": { 
     "MainTemplate": { 
      "template": "commonapp/templates/MainTemplate.html", 
      "controller": "commonapp/templates/MainTemplate.js", 
      "nls": "commonapp/templates/nls/MainTemplate", 
      "defaultView": "SampleView+HiddenMenu", 
      "views": { 
       "SampleView": { 
        "template": "commonapp/sample/SampleView.html", 
        "controller": "commonapp/sample/SampleView.js", 
        "nls": "commonapp/sample/nls/SampleView", 
        "constraint" : "center", 
       }, 
       "HiddenMenu": { 
        "template": "commonapp/MenuItems/HiddenMenu.html", 
        "controller": "commonapp/MenuItems/HiddenMenu.js", 
        "nls": "commonapp/MenuItems/nls/HiddenMenu", 
        "constraint" : "bottom" 
       }, 
       "ExpandedMenu": { 
        "template": "commonapp/MenuItems/ExpandedMenu.html", 
        "controller": "commonapp/MenuItems/ExpandedMenu.js", 
        "nls": "commonapp/MenuItems/nls/ExpandedMenu", 
        "constraint": "bottom" 
       } 
      } 
     } 
    } 
}

的HiddenMenu和ExtendedMenu意見只包含一個按鈕，用來這些視圖之間切換。例如，HiddenMenu.html看起來像：

<div class="mblView"> 
<script type="dojo/require">at: "dojox/mvc/at"</script> 
<div style="text-align: right"> 
     <button data-dojo-type="dojox.mobile.Button" data-dojo-attach-point="dapMenuButton">Label</button> 
</div> 
</div>

和HiddenMenu.js控制器對init方法以下代碼：

on(this.view.dapMenuButton, "click", lang.hitch(this, function(e) { 
    var transOpts = { 
     target : "MainTemplate,ExpandedMenu", 
     url : "#MainTemplate,ExpandedMenu" // this is optional if not set it will be created from target 
    }; 
    this.view.app.transitionToView(e.target,transOpts,e); 
}));

另一種具有類似的代碼。該應用可以正確加載，但在切換這兩個視圖時，我遇到了一個奇怪的行爲。即使切換正確發生，這兩個視圖也不會顯示在預期的相同空間中，這將位於頁面的底部。其中一個正在上方顯示。我的目的是第二個按鈕（「隱藏標籤」）佔據第一個按鈕（「標籤」）留下的空間。有沒有人知道如何實現這一目標？

謝謝

來源

2014-07-23 tigermarques

我不知道，因爲我還沒有建立一個應用程序完全一樣，但認爲這個問題是您正在使用嵌套的視圖和多個默認的孩子。

是MainTemplate，SampleView在轉換後仍然可見？你可能想嘗試與過渡：

目標：「MainTemplate，SampleView + MainTemplate，ExpandedMenu」，

會是有意義的有有HiddenMenu和ExpandedMenu與「約束」一個單親下：「底部」，沒有同一父視圖下的SampleView？這可能也有幫助。

讓我知道如果你仍然有問題，我們可以嘗試找出一種方法來幫助我調試它。

Regards， Ed

來源

2014-07-23 18:02:37 edchat

Dojox/app：如何正確切換視圖？

回答

相關問題