¿Alguien ha intentado usar el componente vue como una propiedad dentro de otro componente, es decir?

 import SomeComponent from "../" export default class ParentComponent extends Vue { public someComponent: SomeComponent = new SomeComponent({ propsData: {someProp: 123} }) public async created(){ await this.someComponent.loadData(); } public beforeDestroy(){ this.someComponent.$destroy(); } }

Y úsalo en una plantilla así:

 <template> <ul> <li v-for="item in someComponent.items"> {{item.name}} </li> </ul> </template>

Por lo que noté, aparte de eso, tengo que pasar parent es decir, new SomeComponent({parent: this, propsData: ..) y llamar a this.someComponent.$destroy at beforeDestroy parece funcionar bien.

Actualizar:

Olvidé mencionar que la idea surgió como un reemplazo de los mixins, ya que realmente no me gustan los inconvenientes de los mixins. Colisiones de nombres de propiedades y métodos y no sabe de dónde viene un campo, especialmente si tiene 2-3 mixins. Vue 3 soluciona todo esto y sé que puedo usar reactive , ref , etc. al igual que en Vue 3 usando una biblioteca en Vue 2, pero la idea era hacer que funcionara sin biblioteca. Estoy abierto a sugerencias si alguien conoce una forma ordenada de reutilizar el código y mantener la reactividad. Este es un POC para la empresa en la que trabajo.

Gracias a todos :)