1.   const app = Vue.createApp({
    2.     data(){
    3.       return{
    4.         classString:'red',
    5.         classObject:{red:false,green:true},
    6.         classArray:['red','green',{brown:true}],
    7.       }
    8.     },
    9.     template: `
    10.       <div :class="classString">
    11.         Hello World
    12.         <demo class="green" />
    13.       </div>
    14.     `
    15.   });
    16.   app.component('demo',{
    17.     template: `
    18.     <div :class="$attrs.class">single</div>
    19.     <div>single</div>
    20.     `
    21.   })
    22.   const vm = app.mount('#root');

    子组件样式不一

    1.   const app = Vue.createApp({
    2.     data(){
    3.       return{
    4.         classString:'red',
    5.         classObject:{red:false,green:true},
    6.         classArray:['red','green',{brown:true}],
    7.         styleString: 'color: yellow;background: orange',
    8.         styleObject: {
    9.           color: 'orange',
    10.           background: 'yellow'
    11.         }
    12.       }
    13.     },
    14.     template: `
    15.       <div :style="styleString">
    16.         Hello World
    17.       </div>
    18.     `
    19.   });
    20.   app.component('demo',{
    21.     template: `
    22.     <div :class="$attrs.class">single</div>
    23.     <div>single</div>
    24.     `
    25.   })
    26.   const vm = app.mount('#root');