如何禁用选项卡切换动画？

Question

我使用extjs 6.6.0。有一个选项卡视图：

Ext.create('Ext.TabPanel', {
    fullscreen: true,
    items: [
        {
            title: 'Home',
            html: 'Home Screen'
        },
        {
            title: 'Contact',
            html: 'Contact Screen'
        }
    ]
});

实际上，这个示例位于以下链接：https://docs.sencha.com/extjs/6.6.0/modern/Ext.tab.Panel.html#configs

告诉我如何禁用选项卡动画。需要一场艰难的冒险。我按下它，它就切换了。我不知道该怎么做

Ext.create('Ext.TabPanel', {
    fullscreen: true,
    hideMode : 'clip',
    items: [
        {
            title: 'Home',
            html: 'Home Screen'
        },
        {
            title: 'Contact',
            html: 'Contact Screen'
        }
    ]
});

我认为这是使用 hideMode : 'clip' 以某种方式完成的。但使用后我发现事实并非如此。要么我做错了什么。 请帮我关掉动画。

Answer 1

您正在寻找的是布局：

Ext.create('Ext.TabPanel', {
    renderTo: document.body,
    height  : 300,
    tabBarPosition: 'bottom',

    layout: {
        type: 'card',
        animation: null
        /*
        Possible values for animation are null or Object
            { type: 'fade' }
        Possilbe values for type are
            // 'cover' 'cube' 'fade' 'flip' 'pop' 'reveal' 'scroll' 'slide'
        */
    },

    items: [
        { title: 'Home', iconCls: 'home', html: 'Home Screen' },
        { title: 'Contact', iconCls: 'user', html: 'Contact Screen' }
    ]
});