<div id="app">
  <div class="p-5">
    <h2>單一混合</h2>
    <card></card>
  </div>
</div>

const mixComponent1 = {
  data() {
    return {
      name: '混合的元件'
    }
  },
  created() {
    console.log('混合的元件1的created生命週期');
  }
};
const app = Vue.createApp({});

app.component('card', {
  template: `<div class="card">
    <div class="card-body">{{ name }}</div>
  </div>`,
  created() {
    console.log('card 的元件生命週期')
  },
  mixins:[mixComponent1]
})

app.mount('#app');