如图，在点击瞬间，会有淡蓝色蒙版是怎么回事 ？

这不是 router-link-active 设定问题，通过设置 router-link-active 无效 ，淡蓝色依然存在与点击瞬间

a{
  outline: none;
  text-decoration: none;

  &:link,&:visited {    
  }

  &:hover,&:active {
    -webkit-tap-highlight-color: transparent;
  }

}

移动端默认样式问题

清除<a>元素的默认样式 试试

因为a标签吧，用$router.push

router-link默认会转换成 a 标签因此我们重置一下这个标签的样式就行

a,
a:hover,
a:active,
a:visited,
a:link,
a:focus {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-tap-highlight-color: transparent;
    outline: none;
    background: none;
    text-decoration: none;
}