小编Tom*_*ley的帖子

Vue 3:组合 API,如何从组件实例调用方法?

在 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)

api composition typescript vue.js vuejs3

4
推荐指数
1
解决办法
1万
查看次数

标签 统计

api ×1

composition ×1

typescript ×1

vue.js ×1

vuejs3 ×1