Not navigating to the leaf node when I Tap on the back button from another view in sencha touch

问题

I have a nested list in my app, on the leaf node i have a map button, I linked my MapView to this button, its going well to the MapView, Now when I tap on the back button of the MapView I am getting a empty view instead of the leaf node with the following warnings

WARN][Ext.Component#constructor] Registering a component with a id (mainlist) which has already been used. Please ensure the existing component has been destroyed

[WARN][Ext.Component#constructor] Registering a component with a id (`detailcard`) which has already been used. Please ensure the existing component has been destroyed (`Ext.Component#destroy()`.

[WARN][Ext.Component#constructor] Registering a component with a id (`description`) which has already been used. Please ensure the existing component has been destroyed (`Ext.Component#destroy()`.

My Map Button

onDetailButtonTap: function(activeItem) {
var record = this;

    Ext.Viewport.animateActiveItem((
                                Ext.create('App.view.MapView')),
                                {
                                    type: 'slide',
                                    direction:'left',
                                }).show();
},

My Map View

handler: function(){
                                //var x=document.getElementById("textt");
                                //alert(x.innerHTML);


                                Ext.Viewport.animateActiveItem((
                                Ext.create('App.view.Sections')),
                                {
                                    type: 'slide',
                                    direction:'left',
                                }).show();

                            }

I need some serious help

回答1:

A common workaround for this issue is to use itemId instead of using id to query a component. With itemId, you can use Ext.ComponentQuery.query to make all queries.

Ext.getCmp('[ID OF THE COMPONENT]');

(Is equivalent to)

Ext.ComponentQuery.query('#[ITEMID OF YOUR COMPONENT]');

To dig in further on ComponentQuery, please follow the link:

http://docs.sencha.com/touch/2.2.0/#!/api/Ext.ComponentQuery

Example:

You have a container/item with an itemId and an id. Like this,

items: [
            {
                xtype: 'titlebar',
                docked: 'top',
                id: 'titleBar',
                itemId: 'barTitle',
                title: 'fooBar'
            },

So, if you just want to change the title using id, you will do this:

Ext.getCmp('titleBar').setTitle('Title Changed using ID'); // 'titleBar' is the ID

You can do this same using itemId too. For that, you can write a line of code like this:

Ext.ComponentQuery.query('#barTitle')[0].setTitle('Title Changed using ItemId');

// 'barTitle' is the ItemId

The above two ways do the same job. So, in your case, you can use the second way to fix the problem. In other words, you can use Ext.ComponentQuery.query function with itemId.

Hope this helps!

来源：https://stackoverflow.com/questions/16701189/not-navigating-to-the-leaf-node-when-i-tap-on-the-back-button-from-another-view

标签

javascript

extjs

touch