diff --git a/src/tabbar-item/index.js b/src/tabbar-item/index.js
index 01eadb653..9339a2ac4 100644
--- a/src/tabbar-item/index.js
+++ b/src/tabbar-item/index.js
@@ -27,8 +27,8 @@ export default createComponent({
routeActive() {
const { to, $route } = this;
if (to && $route) {
- const path = isObj(to) ? to.path : to;
- return $route.path === path;
+ const config = isObj(to) ? to : { path: to };
+ return config.path === $route.path || config.name === $route.name;
}
}
},
diff --git a/src/tabbar/test/__snapshots__/index.spec.js.snap b/src/tabbar/test/__snapshots__/index.spec.js.snap
index c89f60f1b..87acd4d81 100644
--- a/src/tabbar/test/__snapshots__/index.spec.js.snap
+++ b/src/tabbar/test/__snapshots__/index.spec.js.snap
@@ -113,6 +113,48 @@ exports[`route mode 3`] = `
`;
+exports[`route mode match by name 1`] = `
+
+`;
+
+exports[`route mode match by name 2`] = `
+
+`;
+
exports[`watch tabbar value 1`] = `
diff --git a/src/tabbar/test/index.spec.js b/src/tabbar/test/index.spec.js
index e5edbf7c3..921031a4e 100644
--- a/src/tabbar/test/index.spec.js
+++ b/src/tabbar/test/index.spec.js
@@ -44,6 +44,40 @@ test('route mode', async () => {
expect(wrapper).toMatchSnapshot();
});
+test('route mode match by name', async () => {
+ const Foo = { render: () => 'Foo' };
+ const Bar = { render: () => 'Bar' };
+ const router = new VueRouter({
+ routes: [
+ { path: '/foo', component: Foo, name: 'foo' },
+ { path: '/bar', component: Bar, name: 'bar' }
+ ]
+ });
+
+ const wrapper = mount({
+ router,
+ template: `
+
+
+ Tab
+
+
+ Tab
+
+
+ `
+ });
+
+ const items = wrapper.findAll('.van-tabbar-item');
+ items.at(0).trigger('click');
+ await later();
+ expect(wrapper).toMatchSnapshot();
+
+ items.at(1).trigger('click');
+ await later();
+ expect(wrapper).toMatchSnapshot();
+});
+
test('router NavigationDuplicated', async done => {
expect(async () => {
const router = new VueRouter();