一、常规(给不同的class名)
<template>
<div>
<h1 class='yy_back yy_color'>杨·一</h1>
</div>
</template>
<style>
.yy_back {
background: red;
}
.yy_color{
color: #409EFF;
}
</style>
二、style样式上增加scoped
<template>
<div>
<h1 class='yy_back yy_color'>杨·一</h1>
</div>
</template>
<style scoped>
.yy_back {
background: red;
}
.yy_color{
color: #409EFF;
}
</style>
三、style样式上增加module
<template>
<div>
<h1 :class="[$style.yy_back, $style.yy_color]">杨·一</h1>
</div>
</template>
<style module>
.yy_back {
background: red;
}
.yy_color{
color: #409EFF;
}
</style>
三种结果都是相同的