feat(Tabbar): add before-change prop (#7081)

src/tabbar/README.md

@@ -160,6 +160,7 @@ export default {
 | route | Whether to enable route mode | _boolean_ | `false` |
 | placeholder `v2.6.0` | Whether to generage a placeholder element when fixed | _boolean_ | `false` |
 | safe-area-inset-bottom | Whether to enable bottom safe area adaptation | _boolean_ | `false` |
+| before-change `v2.10.4` | Callback function before changing tabs，return `false` to prevent change，support return Promise | _(name) => boolean \| Promise_ | - |
 
 ### Tabbar Events
 

src/tabbar/README.zh-CN.md

@@ -168,6 +168,7 @@ export default {
 | route | 是否开启路由模式 | _boolean_ | `false` |
 | placeholder `v2.6.0` | 固定在底部时，是否在标签位置生成一个等高的占位元素 | _boolean_ | `false` |
 | safe-area-inset-bottom | 是否开启[底部安全区适配](#/zh-CN/quickstart#di-bu-an-quan-qu-gua-pei)，设置 fixed 时默认开启 | _boolean_ | `false` |
+| before-change `v2.10.4` | 切换标签前的回调函数，返回 `false` 可阻止切换，支持返回 Promise | _(name) => boolean \| Promise_ | - |
 
 ### Tabbar Events
 

src/tabbar/index.js

@@ -1,6 +1,7 @@
 import { createNamespace } from '../utils';
-import { ParentMixin } from '../mixins/relation';
 import { BORDER_TOP_BOTTOM } from '../utils/constant';
+import { callInterceptor } from '../utils/interceptor';
+import { ParentMixin } from '../mixins/relation';
 
 const [createComponent, bem] = createNamespace('tabbar');
 
@@ -12,6 +13,7 @@ export default createComponent({
     zIndex: [Number, String],
     placeholder: Boolean,
     activeColor: String,
+    beforeChange: Function,
     inactiveColor: String,
     value: {
       type: [Number, String],
@@ -67,8 +69,14 @@ export default createComponent({
 
     onChange(active) {
       if (active !== this.value) {
-        this.$emit('input', active);
-        this.$emit('change', active);
+        callInterceptor({
+          interceptor: this.beforeChange,
+          args: [active],
+          done: () => {
+            this.$emit('input', active);
+            this.$emit('change', active);
+          },
+        });
       }
     },