вызов функции typeScript из компонента VUE - PullRequest
Новая
       7

вызов функции typeScript из компонента VUE

0 голосов
/ 27 сентября 2019

Я только начал с 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
        })
    }
}

Что яя пытаюсь добиться, чтобы удалить вызов axios API GET, который у меня есть внутри компонента VUE, как указано выше, и вместо этого вызвать функцию, которую я написал внутри моего файла APIService.TS, который в конечном итоге делает вызов GET.

Мой файл apiService.ts имеет следующий вид: 

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);
               })
           })
    }
}

Когда я помещаю import APIService from '../../services/apiService' внутри компонента VUE, я получаю сообщение об ошибке: 

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 для службы API из VUE Component?

1 Ответ

1 голос
/ 30 сентября 2019

Ваш импорт немного неправильный.Вот что должно быть: 

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