我使用Vue -custom-element在Vue中创建web组件,并在Angular中使用它。Vue+js:
import Vue from 'vue'
import Calculator from './components/Calculator.vue'
import vueCustomElement from 'vue-custom-element'
Vue.use(vueCustomElement)
Vue.customElement('js-calculator', Calculator)
和我在Angular中使用的index.html:
<body>
<app-root></app-root>
<js-calculator msg="30"></js-calculator>
</body>
很好。但是当我在Vue(而不是javascript)中使用typescript和Vue -class-component并使用相同的代码时,我在Angular中看不到web-component。Vue+的计算器也在一个单独的应用程序中工作。有什么问题吗?
正确答案: 用代替
Vue.customElement('ts-calculator', Calculator)
应该使用
Vue.customElement('ts-calculator', (Calculator as any).options)
或
Vue.customElement('ts-calculator', new Calculator().$options)