尝试使用带有typescript的vue-router时出现“没有与此调用匹配的重载”

k2fxgqgv  于 2022-11-17  发布在  Vue.js
关注(0)|答案(1)|浏览(436)

我拼命地想让vue和vue路由器与打字稿一起工作,我一直在路由器上遇到问题。
由于对我的团队施加的限制,我们无法使用节点和包管理器,因此我们被迫使用脚本方法安装vue和vue-router:

<script src="~/scripts/libs/vue/vue.js"></script>
<script src="~/scripts/libs/vue-router/vue-router.js"></script>

除了使用上述安装vue的方法外,我们也无法使用任何捆绑工具,因为import和require()也不可用。
就其本身而言,我们没有问题,与vue和typescript结合,但当我试图使用vue-router由于某种原因,我无法让vue拾取路由器.当我试图使用路由器描述的文档,我得到一个“没有过载匹配这个调用”.
当我沿着这条路线走下去时,我使用了以下方法:

const homeComponent = { template: "<div>Home</div>" };

const routes = [
    { path: "/", component: homeCompoent }
];

const router = new VueRouter({routes});
Vue.use(VueRouter);

const app = new Vue({
    el: "#app",
    router,
    data: { intl: Resources }
});

这是当我开始得到打字脚本的问题,因为一个路由器的超载丢失。我也试着按照文档中的例子,即使这样,我仍然得到一个超载错误从打字脚本。

编辑

我想我已经解决了实际的问题,但我仍然不知道为什么会发生,以及如何解决它。
在我尝试使用的其他库中也出现了完全相同的问题,其中typescript似乎是问题所在。在vue-router的情况下,实际的问题是Vue对象不包含router对象的定义,所以当我尝试使用该对象时,很自然地,就像文档中指出的那样,typescript抛出了一个错误。现在我有了vue-router的类型定义,但是从我所看到的来看,这些类型定义要么没有被使用,要么有一个错误阻止它们正确地更新Vue对象

0vvn1miw

0vvn1miw1#

你不需要定义一个组件,你只需要提供一个对象。它没有定义ComponentOptions,所以它失败了。只要让它成为一个组件(并正确拼写)

const homeComponent = Vue.component('home-component', {
  template: '<div>Home</div>'
})

现在它是一个正确的组件,并且将具有ComponentOptions,因此您不会得到关于matched未定义的错误(这是此.$router的属性):

const routes = [
  { path: "/", component: homeComponent }
];

相关问题