Question

我刚开始使用VUE并被卡住。

我有一个简单的VUE组件，它的脚本部分是：

<script>
import Dish from './dish.vue'
import SearchBar from './search.vue'
import axios from 'axios'

export default {
    components: {Dish, SearchBar},
    name: "selectDish",
    data() {
        return {
            dishes : []
        }
    },
    mounted(){     
    axios.get('http://example.com/',{method :'GET'})
    .then(response =>{
        console.log(response);
        this.dishes=response.data
        })
    }
}

我想要实现的是如上所述删除VUE组件内的axios API GET调用，而是调用我在APIService.TS文件中编写的函数，该函数最终使{{1 }}。

我的apiService.ts文件如下：

GET

将import Promise, { config, resolve, reject } from 'bluebird'; import Config from '../config'; import axios from 'axios'; export class APIService{ constructor(){ } public giveMeAllDishes(dishType, query) : Promise<string>{ return new Promise((resolve,reject) =>{ axios.get('http://example.com',{method : 'GET'}) .then(function(respone){ console.log(respone); resolve(respone.data); }) .catch(function(err){ reject(err); }) }) } }放在VUE组件中时，出现错误消息：

import APIService from '../../services/apiService'

此外，当我解决此引用问题时，如何从ERROR in ./~/babel-loader/lib!./~/vue-loader/lib/selector.js?type=script&index=0!./src/components/selectDish/selectDish.vue Module not found: Error: Can't resolve '../../services/apiService'调用API服务的'giveMeAllDishes'函数？

Answer 1

您的导入略有错误。这是需要的：

import { APIService } from '../../services/apiService'

从VUE组件调用typeScript函数

1 个答案: