Vue.js vue材质本地化主题以避免冲突

运行vuejs应用程序作为网站的组件，使用vue材质主题化css与现有css产生冲突

默认情况下，vue material在html

上添加一个类以应用其样式，但我试图通过仅应用于特定的DOM元素（应该是我的vue应用程序）来改变这一点

来自材料界面，我正在寻找的是与之相当的

此外，我只导入少数组件，执行以下操作：

import { MdTabs, MdRadio } from "vue-material/dist/components";
import "vue-material/dist/vue-material.min.css";
import "./theme.scss";

Vue.use(MdRadio);
Vue.use(MdTabs);

主题。scss重新定义颜色以匹配我的主题

@import "./variables";
@import "~vue-material/dist/theme/engine"; // Import the theme engine

@include md-register-theme("default", (
  primary: $purple,
  accent: $purple
));

@import "~vue-material/dist/theme/all"; // Apply the theme

我正在使用带有以下Syntax模板的single.vue文件：

<template>
  <div>
    <md-radio v-model="radio" :value="objA">20€ / an</md-radio>
    <md-radio v-model="radio" :value="objB">2€ / mois</md-radio>
  </div>
</template>

20欧元/年
2欧元/MOI