Question

我在ExtJs4工作。我陷入困境，我必须将我的网址更改为E：//demoProj/index.html到E：//demoProj/index.html #firstpage或E：//demoProj/index.html#secondpage基于extjs4中的每页（视图）。我试了很多但还没解决它。我怎么能解决这个问题？请给我一些指导。提前致谢。

Answer 1

如果您要问的是如何更改锚点是地址栏，请按以下步骤操作：

window.location.hash = 'firstpage';

如果您的问题更多是关于如何跟踪视图计数，那么您将需要某种存储机制。如果您将自己限制在客户端，cookies可能是一个解决方案。

示例：

Ext.onReady(function() {
    var cookies = Ext.util.Cookies,
        // accounting for first time (undefined), and casting to int
        currentViewCount = +cookies.get('viewCount') || 0;

    // update view count
    cookies.set('viewCount', currentViewCount + 1);

    window.location.hash = 'page' + currentViewCount;
});

Answer 2

如果您使用卡片布局和菜单，您可以执行以下操作：

在您的视口中

var APP_CARD_ITEMS_MAP = new Ext.util.HashMap();
APP_CARD_ITEMS_MAP.add('home', 0);
APP_CARD_ITEMS_MAP.add('page1', 1);
APP_CARD_ITEMS_MAP.add('page2', 2);

Ext.define('AM.view.Viewport' ,{
extend: 'Ext.container.Viewport',
id:'myviewport',
requires:[
          'APP.view.*'    
          ], 
items: [{
        xtype:'panel',
        items:[     
               {
                xtype:'panel',
                items: [                
                      {
                        xtype:'BodyPanel',
                        id:'bodypanel' 
                      } 
                    ]
              }
             ]
             ...........

创建一个容器（此处为bodypanel）并将所有页面都包含在其中。点击后，您可以使用以下命令更改网址和所需页面：

window.location.hash = '#'+ menu.itemId;
Ext.getCmp('bodypanel').getLayout().setActiveItem(1);

在您的BodyPanel中

  Ext.define('AM.view.BodyPanel',{
  extend:'Ext.Container', 
  alias:'widget.BodyPanel',
  xtype:'bodypanel',
  requires:[''],  //your views
  fullscreen:true,
  layout: 'card',
  activeItem:0,   
  listeners:{
      afterrender:function(){
         var hashedUrl = window.location.hash; 
            if(hashedUrl && hashedUrl.indexOf(":")==-1){
                hashedUrl = hashedUrl.substring(1, hashedUrl.length);
                var activeItem = APP_CARD_ITEMS_MAP.get(hashedUrl);
                Ext.getCmp('bodypanel').getLayout().setActiveItem(activeItem);
            }   
      }
  },
  items : [{
              xtype: 'page1',                         
                  id:'page1',
                  x:200
            },{
                  xtype: 'page2',
                  id:'page2',
                  x:200
            },
          ]
  .............

如何根据每页渲染更改extjs4中的url？

2 个答案:

如何根据每页渲染更改ex​​tjs4中的url？

2 个答案:

如何根据每页渲染更改extjs4中的url？