在 Vue 2 中我确实喜欢这样:
import Component from '@/components/Component.vue';
const VueComponent = {
install(Vue, settings = {}) {
const Constructor = Vue.extend(Component);
const ComponentContainer = new Constructor();
ComponentContainer._props = Object.assign(ComponentContainer._props, settings);
const vm = ComponentContainer.$mount();
document.querySelector('body').appendChild(vm.$el);
}
}
Run Code Online (Sandbox Code Playgroud)
然后我可以像这样调用任何组件方法:
ComponentContainer.add();
Run Code Online (Sandbox Code Playgroud)
我正在尝试使用 Vue 3、TS 和 Composition API 制作我的组件,所以我这样做:
import { App, createApp, Component } from 'vue';
import ComponentName from './components/ComponentName.vue';
const VueComponentName: Component = {
install(Vue: App, settings = {}) {
const ComponentContainer = createApp(ComponentName);
ComponentContainer._component.props = Object.assign(ComponentContainer._component.props, settings);
const wrapper = …
Run Code Online (Sandbox Code Playgroud)