在将Vue.js与Typescript一起使用时，如何使用vue

本文介绍了在将Vue.js与Typescript一起使用时，如何使用vue-resource等插件？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我开始使用Typescript并尝试将其应用于我的项目。但是，我不能让Vue.js插件像vue-resource一样使用它。

I started using Typescript and trying to apply it to my project. However, I can't get Vue.js plugins like vue-resource to work with it.

当我使用

this.$http.post()

I得到错误：

错误TS2339：类型'typeof Vue'上不存在属性'$ http'。

error TS2339: Property '$http' does not exist on type 'typeof Vue'.

这是有道理的，因为我在一个类上下文中。但是我该怎么做呢？这是我的完整组成部分：

which makes sense because I am in a class context. But how can I do that? This is my full component:

<template> <div> <h1>Sign up</h1> <form> <div class="form-group"> <label for="name">Name</label> <input v-model="name" type="text" class="form-control" name="name" placeholder="Name"> <small class="form-text text-muted">Please provide a name.</small> </div> <div class="form-group"> <label for="name">Password</label> <input v-model="password" type="password" class="form-control" name="password" placeholder="Password"> <small class="form-text text-muted">Please provide a password.</small> </div> <input type="submit" class="btn btn-primary" value="Submit" @click.prevent="save"> </form> </div> </template> <script lang="ts"> import Component from 'vue-class-component' @Component export default class SignUp extends Vue { name: string = '' password: string = '' save(): void { this.$http.post('/api/sign-up', { name: this.name, password: this.password }) .then((response: any) => { console.log(response) }) } } </script>

我在 main.ts 像这样：

import Vue from "vue" import router from "./router" import App from "./app" const VueResource = require('vue-resource') Vue.use(VueResource) new Vue({ el: "#app", router, template: "<App/>", components: { App }, });

推荐答案

使用 import 而不是 require 。

import VueResource from 'vue-resource'