ExtJS配置TabPanel可以拖拽Tab标签页

更新记录
2023年4月13日 新增BUG提示。
2022年6月25日 新增汇总链接。

ExtJS教程汇总：https://www.cnblogs.com/cqpanda/p/16328016.html

注意：此组件有布局更新BUG，解决办法：https://www.cnblogs.com/cqpanda/p/17312549.html

1.环境说明

ExtJS版本：7.4.0.42
Sencha Cmd: v7.5.1.20
开发工具：WebStorm 2022.1.1
PS：如果是老版本的ExtJS，引入Ext.ux.TabReorderer.js，然后加载plugins即可。

2.进行配置

在app.json中加载Ext.ux包。大约在510行左右。

"requires": [
    "ux"  //加载Ext.ux包
],

实际配置如下：

---

然后在应用中请求包

requires: [
    'Ext.ux.TabReorderer',
],

实际配置如下：

---

在tabpanel组件中，加载tabreorderer控件。

plugins: {
    tabreorderer: true
},

实际配置如下：

---

开启查看
打开控制台，切换到项目下，执行：

sencha app watch

---

搞定，可以拖拽Tab标签页了。