如何将来自另一个组件的类绑定为道具

<template>
  <div>
    <p>目标组件</p>
    <p>接收到的类的属性值为: {{ receivedClass }}</p>
  </div>
</template>

<script>
export default {
  props: ['receivedClass'],
};
</script>

<template>
  <div>
    <p>源组件</p>
    <button @click="passClass">传递类</button>
    <target-component :received-class="myClass"></target-component>
  </div>
</template>

<script>
import TargetComponent from './TargetComponent.vue';

export default {
  components: {
    TargetComponent,
  },
  data() {
    return {
      myClass: null,
    };
  },
  methods: {
    passClass() {
      // 创建一个类的实例
      this.myClass = new MyClass();
    },
  },
};

class MyClass {
  constructor() {
    this.property = '这是一个类的属性';
  }

  method() {
    console.log('这是一个类的方法');
  }
}
</script>