router-link 使用精确匹配

export default newRouter({
  routes: [
    {
      path: '/',
      name: 'Index',
      component: Index
    },
    {
        path: '/mall',
        name: 'Mall',
        component: Mall
    },
    {
        path: '/shoppingCar',
        name: 'ShoppingCar',
        component: ShoppingCar
    },
    {
        path: '/mySet',
        name: 'MySet',
        component: MySet
    },
    {
        path: '/news',
        name: 'News',
        component: News
    },
    {
        path: '/productDetail',
        name: 'ProductDetail',
        component: ProductDetail
    }
  ],
    mode: 'history',
    linkActiveClass: "active",//配置精确匹配，将router-link-active定义为active
    scrollBehavior(to, from, savedPosition) {
      //keep-alive 返回缓存页面后记录浏览位置
　　　//scrollBehavior滚动行为
      if (savedPosition &&to.meta.keepAlive) {
        returnsavedPosition;
      }
      //异步滚动操作
      return new Promise((resolve) =>{
        setTimeout(() =>{
          resolve({
            x: 0,
            y: 1});
        }, 0);
      });
    }
})

<template>
    <div class="bottomNav">
        <ul>
            <li>
                <router-link exact  :to="{ name: 'Index', params: {} }">
<!-- exact 只要写一个就可以了 -->
<img src="../../static/images/greenhome.png" />
                </router-link>

            </li>
            <li>
                <router-link :to="{ name: 'Mall', params: {countt:'积分商城'} }">
                    <img src="../../static/images/grayshop.png" />
                </router-link>
            </li>
            <li>
                <router-link :to="{ name: 'ShoppingCar', params: {newsHeader:'购物车',upLeft:true,shopicon:false} }">
                    <img src="../../static/images/graycar.png" />
                </router-link>
            </li>
            <li>
                <router-link :to="{ name: 'MySet', params: {} }">
                    <img src="../../static/images/graymine.png" />
                </router-link>
            </li>
        </ul>
    </div>
</template>