要使Vue样式仅在当前页面生效，你可以使用作用域样式或者局部样式。以下是两种常见的方法：
1. 作用域样式
Vue 支持使用带有scoped属性的<style>标签来创建作用域样式。这样，样式只会应用于当前组件的元素，不会影响其他组件。
<template><div class="wrapper">
<!-- 在这里编写模板代码 -->
</div>
</template>
<style scoped>
.wrapper {
background-color: red;
/* 其他样式规则 */
}
</style>
在上面的示例中，.wrapper类的样式只会应用于当前组件中的元素，并且不会影响其他组件。
2. 局部样式
如果你不想使用作用域样式，也可以使用局部样式。在 Vue 组件中，你可以在 `<style>` 标签内定义样式，这些样式只会应用于当前组件的元素。
<template><div class="wrapper">
<!-- 在这里编写模板代码 -->
</div>
</template>
<style>
.wrapper {
background-color: red;
/* 其他样式规则 */
}
</style>
与作用域样式相比，局部样式没有 `scoped` 属性，所以它们不能自动隔离样式。但是，由于样式定义在组件文件中，它们只会应用于该组件的元素，并且不会影响其他组件。
以上是实现 Vue 样式只在当前页面生效的两种常用方法。根据你的需求和项目结构，选择适合你的方式即可。
