vue 3 typescript Uncaught (in promise) TypeError: this.$on is not a function [英] vue 3 typescript Uncaught (in promise) TypeError: this.$on is not a function
问题描述
我安装了一个带有 vue-cli 和 typescript 的全新 Vue 3.一切运行但是当我添加一个 https://vue-select.org/ 包时我在浏览器控制台上收到此错误
Uncaught (in promise) TypeError: this.$on is not a function在 Proxy.created (vue-select.js?4a7a:1)在 callWithErrorHandling (runtime-core.esm-bundler.js?5c40:155)在 callWithAsyncErrorHandling (runtime-core.esm-bundler.js?5c40:164)在 callHook (runtime-core.esm-bundler.js?5c40:3182)在 applyOptions (runtime-core.esm-bundler.js?5c40:3109)在finishComponentSetup (runtime-core.esm-bundler.js?5c40:7265)在 setupStatefulComponent (runtime-core.esm-bundler.js?5c40:7190)在 setupComponent (runtime-core.esm-bundler.js?5c40:7117)在 mountComponent (runtime-core.esm-bundler.js?5c40:5115)在 processComponent (runtime-core.esm-bundler.js?5c40:5090)
简单例子
Home.vue<模板><div class="home"><img alt="Vue logo";src=../assets/logo.png"><vSelect :options="[{label: 'Canada', code: 'ca'}]"></vSelect>
</模板><script lang="ts">import { Options, Vue } from 'vue-class-component';从 '@/components/HelloWorld.vue' 导入 HelloWorld;//@ 是/src 的别名从 'vue-select' 导入 vSelect;@选项({成分: {你好,世界,选择},})导出默认类 Home 扩展 Vue {}
我认为问题与 Vue3 无关.它与打字稿有关.只需添加这个包@types/vue-select
.这个包包含 vue-select
的类型定义.此外,如果您正在使用 webpack 作为您的包,请不要忘记添加此包 @types/webpack-env
.它包含 webpack 的类型定义.
I have a fresh Vue 3 installed with vue-cli and typescript. Everything running but when I add a https://vue-select.org/ package I get get this error on the browser console
Uncaught (in promise) TypeError: this.$on is not a function
at Proxy.created (vue-select.js?4a7a:1)
at callWithErrorHandling (runtime-core.esm-bundler.js?5c40:155)
at callWithAsyncErrorHandling (runtime-core.esm-bundler.js?5c40:164)
at callHook (runtime-core.esm-bundler.js?5c40:3182)
at applyOptions (runtime-core.esm-bundler.js?5c40:3109)
at finishComponentSetup (runtime-core.esm-bundler.js?5c40:7265)
at setupStatefulComponent (runtime-core.esm-bundler.js?5c40:7190)
at setupComponent (runtime-core.esm-bundler.js?5c40:7117)
at mountComponent (runtime-core.esm-bundler.js?5c40:5115)
at processComponent (runtime-core.esm-bundler.js?5c40:5090)
Simple example
Home.vue
<template>
<div class="home">
<img alt="Vue logo" src="../assets/logo.png">
<vSelect :options="[{label: 'Canada', code: 'ca'}]"></vSelect>
</div>
</template>
<script lang="ts">
import { Options, Vue } from 'vue-class-component';
import HelloWorld from '@/components/HelloWorld.vue'; // @ is an alias to /src
import vSelect from 'vue-select';
@Options({
components: {
HelloWorld,
vSelect
},
})
export default class Home extends Vue {}
</script>
I think the problem is not related to Vue3. It is related to typescript. Just add this package @types/vue-select
. This package contains type definitions for vue-select
. Also if you are using webpack for your bunlder, don't forget to add this package @types/webpack-env
. It contains type definitions for webpack.
这篇关于vue 3 typescript Uncaught (in promise) TypeError: this.$on is not a function的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!