Как изменить URL-адрес в extjs4 на основе рендеринга страницы?

Я работаю в ExtJs4. Я застрял в точке, где мне нужно изменить свой URL-адрес, например E://demoProj/index.html, на E://demoProj/index.html#firstpage или E://demoProj/index.html#secondpage на основе каждой страницы (просмотра) в extjs4. Я много пробовал, но еще не решил. Как я могу решить эту проблему? Пожалуйста, дайте мне некоторые рекомендации. Заранее спасибо.


url url-routing extjs extjs-mvc extjs4.2
person Pravin Mane    schedule 06.06.2013    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Если вы спрашиваете, как изменить якорь в адресной строке, вот как это сделать:

window.location.hash = 'firstpage';

Если ваш вопрос больше о том, как отслеживать количество просмотров, вам понадобится какой-то механизм хранения. Если вы ограничиваетесь только клиентской частью, решением могут стать файлы cookie.

Пример:

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;
});
person rixo    schedule 06.06.2013

arrow_upward
0
arrow_downward

Если вы используете макет карты и меню, вот что вы можете сделать:

В области просмотра

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) и включите все свои страницы поверх их. При нажатии вы можете изменить URL-адрес и нужную страницу, используя:

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
            },
          ]
  .............
person Dev    schedule 07.06.2013