1、全局代码App.vue如下
<script setup>
import Testpage001 from './view/Testpage001.vue'
import Testpage002 from './view/Testpage002.vue'
</script>
<template>
<div class="style1">测试1</div>
<Testpage001/>
<Testpage002/>
</template>
<style>
.style1 {
color: red;
font-size: 30px;
}
</style>
2、Testpage001代码如下
<template> <div class="style1">测试1</div> </template> <script> </script>
3、Testpage002代码如下
<template>
<div v-bind:class="testCls">测试2</div>
</template>
<script>
export default {
data() {
return {
testCls: "style1",
}
}
}
</script>
<style scoped>
.style1 {
color: blue;
font-size: 30px;
}
</style>
4、效果如下：
标签：style1,vue,color,如下,sytle,scoped,Vue3,Testpage001,Testpage002 From： https://www.cnblogs.com/tianpan2019/p/18352944