내비게이션보기 Sencha Touch 2

Question

Sencha Touch 2에서 내 NavigationView에 문제가 있습니다. '뒤로'버튼을 누르면 하나 이상의 창을 탐색 할 수 없습니다.

나는 view.push() 및 view.pop()을 사용하여 탐색합니다.

view.js :

Ext.define('MyApp.view.view', { 
extend: 'Ext.navigation.View', 
alias: 'widget.View', 

config: { 
    id: 'nvView', 
    items: [ 
     { 
      xtype: 'toolbar', 
      docked: 'bottom', 
      layout: { 
       align: 'center', 
       pack: 'center', 
       type: 'hbox' 
      }, 
      items: [ 
       { 
        xtype: 'button', 
        iconAlign: 'center', 
        iconCls: 'info', 
        iconMask: true, 
        text: 'Ayuda' 
       }, 
       { 
        xtype: 'button', 
        iconAlign: 'center', 
        iconCls: 'compose', 
        iconMask: true, 
        text: 'Guardar' 
       }, 
       { 
        xtype: 'button', 
        id: 'volver', 
        iconAlign: 'center', 
        iconCls: 'reply', 
        iconMask: true, 
        text: 'Volver' 
       } 
      ] 
     }, 
     { 
      xtype: 'formpanel', 
      title: 'View', 
      html: 'View1', 
      id: 'View1', 
      styleHtmlContent: true, 
      items: [ 
       { 
        xtype: 'button', 
        docked: 'bottom', 
        id: 'bView1', 
        margin: 10, 
        ui: 'forward', 
        text: 'siguiente' 
       } 
      ] 
     } 
    ] 
} 
}); 

view2.js :

Ext.define('MyApp.view.View2', { 
extend: 'Ext.form.Panel', 
alias: 'widget.View2', 

config: { 
    fullscreen: true, 
    html: 'View2', 
    id: 'View2', 
    styleHtmlContent: true, 
    items: [ 
     { 
      xtype: 'button', 
      docked: 'bottom', 
      id: 'bView2', 
      margin: 10, 
      ui: 'forward', 
      text: 'siguiente' 
     } 
    ] 
} 
}); 

view3.js :

Ext.define('MyApp.view.View3', { 
extend: 'Ext.form.Panel', 
alias: 'widget.View3', 

config: { 
    fullscreen: true, 
    html: 'View3', 
    id: 'View3', 
    styleHtmlContent: true, 
    items: [ 
     { 
      xtype: 'button', 
      docked: 'bottom', 
      id: 'bView3', 
      margin: 10, 
      ui: 'forward', 
      text: 'siguiente' 
     } 
    ] 
} 
}); 

ViewController.js :

Ext.define('MyApp.controller.ViewController', { 
extend: 'Ext.app.Controller', 

config: { 
    views: [ 
     'View' 
    ], 

    refs: { 
     bView1: 'bView1', 
     bView2: 'bView2' 
    }, 

    control: { 
     "#bView1": { 
      tap: 'onView1' 
     }, 
     "#bView2": { 
      tap: 'onView2' 
     } 
    } 
}, 

onView1: function(button, e, options) { 
    button.up('navigationview').push({ 
     xtype: 'View2', 
     title: 'View2' 
    }); 
}, 

onView2: function(button, e, options) { 
    button.up('navigationview').push({ 
     xtype: 'View3', 
     title: 'View3' 
    }); 
} 
}); 

내 문제의 예는 다음과 같습니다. view1에서 시작한 다음 'siguiente'버튼을 누르면 view2로 이동합니다. 'navigation'에서 'back'버튼을 누르면 view1로 이동 한 다음 'siguiente'버튼을 누르고 view2로 이동하지만 view2에서는 'siguiente'버튼을 누를 때 view3을 사용할 수 없습니다.

미리 감사드립니다.

Answer 1

id을 사용했기 때문에 두 번째로 충돌이 발생하고 경고 및 기능이 제대로 작동하지 않음을 보여줍니다. itemId을 사용하면 안전 할 것입니다.

itemId: 'bView1' //same for other view bView2, bView3 

은 참조하려면 당신의 itemId 컨트롤러, 단지 예를 들어 다음과 같이 수행

refs: { 
    bView1: '[itemId=bView1]', 
    bhView2: '[itemId=bView2]', 
    bhView3: '[itemId=bView3]' 
}, 

control: { 
    bView1: { 
     tap: 'onView1' 
    }, 
    bhView2: { 
     tap: 'onView2' 
    }, 
}, 

onView1: function(button, e, options) { 
    button.up('navigationview').push({ 
     xtype: 'View2', 
     title: 'View2' 
    }); 
}, 

onView2: function(button, e, options) { 
    button.up('navigationview').push({ 
     xtype: 'View3', 
     title: 'View3' 
    }); 
} 

이 도움이 :)