ExtJS7：锚标记不支持分机路由

Question

如果外部视图路线与锚标记一起使用，单击该 link 总是会打开一个新选项卡。这会强制在新选项卡中重新加载整个分机应用程序。有没有办法强制 html 中的锚标记或锚将 ct 重定向到该视图，而不是在 app

中

                        {
                            xtype: 'component',
                            autoEl: {
                                tag: 'a',
                                html: 'Some Action',
                                href: '#someroute'
                                class: 'link-some-action'
                            },
                            listeners: {
                              click: function(){
                                console.warn("I AM TRAPPED");
                              }
                            }
                        }

或

                        {
                            xtype: 'box',
                            html: '<a href='#someaction' class="link-some-action"> Saome Action </a>',
                            listeners: {
                              click: function(){
                                console.warn("I AM TRAPPED");
                              }
                            }
                        }

如图所示，在这两种情况下，单击元素都会打开一个新选项卡，因此会强制重新加载应用

Answer 1

在你的情况下，你应该给 el 添加一个监听器，here is fiddle

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

    onElClick:function(){
        console.log("I AM FREE");
        this.redirectTo("test")
    }

});
Ext.create('Ext.panel.Panel', {
    style: "border: 1px solid red",
    height: 100,
    controller:"mycontroller",
    title: "test",

    renderTo: Ext.getBody(),
    items: [{
        xtype: 'component',
        autoEl: {
            tag: 'a',
            html: 'Some Action',
            href: '#someroute',
            class: 'link-some-action'
        },
        listeners: {
            el: {
                click: "onElClick"
            }
        }
    }]
})

ExtJS7：锚标记不支持分机路由

ExtJS7: Anchor tag not honoring ext routes

extjs

extjs7