在 vuetify.js 中，将路由器路径指定为属性 (<v-btn to="/path">) 会使按钮看起来处于 "hover" 状态
In vuetify.js, Specifying a router path as an attribute (<v-btn to="/path">) makes the button look like it's in "hover" state
我正在尝试将路由器 link 添加到按钮。
在下面的代码中，您可以看到我使用了两种不同的方法：
代码
<!-- Button 1 -->
<v-btn flat to='/'>home</v-btn>
<!-- Button 2 -->
<router-link to='/' tag='span' style='cursor:pointer;'>
<v-btn flat>home</v-btn>
</router-link>
结果
第一个（使用 to="" 属性）看起来一直处于悬停状态（悬停按钮时颜色相同）
问题
有办法解决吗？我喜欢第一种方法，比较简单，但是为什么看起来不对呢？
我应该使用第一种方法，还是第二种方法更好？
取决于你想要什么（但我假设你不希望按钮 在任何路线上突出显示），将 active-class 指定为空。
<v-btn flat to='/' active-class>home</v-btn>
或者，对于家庭路线，您可能想使用 exact 这样按钮就不会在每个页面上都突出显示，而只会在 /.
处突出显示
<v-btn flat to='/' exact>home</v-btn>
Here is more about why it happens, and vuetify buttons api 解释道具。
我正在尝试将路由器 link 添加到按钮。
在下面的代码中，您可以看到我使用了两种不同的方法：
代码
<!-- Button 1 -->
<v-btn flat to='/'>home</v-btn>
<!-- Button 2 -->
<router-link to='/' tag='span' style='cursor:pointer;'>
<v-btn flat>home</v-btn>
</router-link>
结果
第一个（使用 to="" 属性）看起来一直处于悬停状态（悬停按钮时颜色相同）
问题
有办法解决吗？我喜欢第一种方法，比较简单，但是为什么看起来不对呢？
我应该使用第一种方法，还是第二种方法更好？
取决于你想要什么（但我假设你不希望按钮 在任何路线上突出显示），将 active-class 指定为空。
<v-btn flat to='/' active-class>home</v-btn>
或者，对于家庭路线，您可能想使用 exact 这样按钮就不会在每个页面上都突出显示，而只会在 /.
<v-btn flat to='/' exact>home</v-btn>
Here is more about why it happens, and vuetify buttons api 解释道具。