[bugfix] Tabbar: avoid navigation duplicated (#4147)

src/tabbar/test/index.spec.js

@@ -1,3 +1,4 @@
+import VueRouter from 'vue-router';
 import { mount, later } from '../../../test/utils';
 import Vue from 'vue';
 import Tabbar from '..';
@@ -5,20 +6,15 @@ import TabbarItem from '../../tabbar-item';
 
 Vue.use(Tabbar);
 Vue.use(TabbarItem);
+Vue.use(VueRouter);
 
 test('route mode', async () => {
-  Vue.util.defineReactive(Vue.prototype, '$route', { path: '/home' });
-
-  Vue.prototype.$router = {
-    replace(to) {
-      Vue.prototype.$route.path = typeof to === 'string' ? to : to.path;
-    }
-  };
-
+  const router = new VueRouter();
   const wrapper = mount({
+    router,
     template: `
       <van-tabbar route>
-        <van-tabbar-item replace to="/home">
+        <van-tabbar-item replace to="/">
           Tab
         </van-tabbar-item>
         <van-tabbar-item replace to="/search">
@@ -48,6 +44,28 @@ test('route mode', async () => {
   expect(wrapper).toMatchSnapshot();
 });
 
+test('router NavigationDuplicated', async done => {
+  expect(async () => {
+    const router = new VueRouter();
+    const wrapper = mount({
+      router,
+      template: `
+      <van-tabbar route>
+        <van-tabbar-item replace to="/home">
+          Tab
+        </van-tabbar-item>
+      </van-tabbar>
+    `
+    });
+
+    const item = wrapper.find('.van-tabbar-item');
+    item.trigger('click');
+    item.trigger('click');
+
+    await later();
+    done();
+  }).not.toThrow();
+});
 
 test('watch tabbar value', () => {
   const wrapper = mount({
@@ -108,7 +126,10 @@ test('name prop', () => {
     }
   });
 
-  wrapper.findAll('.van-tabbar-item').at(1).trigger('click');
+  wrapper
+    .findAll('.van-tabbar-item')
+    .at(1)
+    .trigger('click');
 
   expect(onChange).toHaveBeenCalledWith('b');
 });

src/utils/router.ts

@@ -14,7 +14,17 @@ export type RouteConfig = {
 export function route(router: VueRouter, config: RouteConfig) {
   const { to, url, replace } = config;
   if (to && router) {
-    router[replace ? 'replace' : 'push'](to);
+    const promise = router[replace ? 'replace' : 'push'](to);
+
+    /* istanbul ignore else */
+    if (promise && promise.catch) {
+      promise.catch(err => {
+        /* istanbul ignore if */
+        if (err.name !== 'NavigationDuplicated') {
+          throw err;
+        }
+      });
+    }
   } else if (url) {
     replace ? location.replace(url) : (location.href = url);
   }
@@ -25,10 +35,10 @@ export function functionalRoute(context: RenderContext) {
 }
 
 export type RouteProps = {
-  url?: string,
+  url?: string;
   replace?: boolean;
   to?: RawLocation;
-}
+};
 
 export const routeProps = {
   url: String,