[解決済み] Vue.js: サービスを定義する

質問

私はAngularの代替としてVue.jsを見ていて、今のところ本当に気に入っています。 その感触を得るために、私は既存のAngularプロジェクトをVueプロジェクトにリファクタリングしています。私はちょうど私のREST APIと通信する必要があるポイントにいます。

Angularでは、私はそのためのサービスを定義し、それを必要とするすべてのコントローラに注入していました。Vueは、私が理解しているように、"service"構造を知らないようです。どのようにVueでこれを実現できますか？

私は考えました。 vue-resource も検討しましたが、私の理解する限りではhttpの機能のみです。jQueryも使っているので、これは時代遅れです。

例です。

私は vueComponent1 と vueComponent2 . どちらも同じRESTリソースにアクセスする必要があります。これを処理するために、両方のコンポーネントがRESTリソースへのリクエストに使用できる中央サービスが必要です。Angularには「service」コンポーネントがあり、まさにそれを実現します。Vueにはありません。

どのように解決するのですか？

Vue.jsのドキュメントより。

Vue.js自体は本格的なフレームワークではなく、ビューレイヤーのみにフォーカスしています。

MVCのV outに焦点を当てたライブラリとして、サービスのようなものは提供しません。

BrowserifyやWebpackのようなモジュールローダーを使っているのでしょうか？

それなら、ES6のモジュールシステムを活用して、自分でサービスを作ることができます。

あなたがしなければならないのは、この新しいモジュールによってエクスポートされるプレーンなJavaScriptクラスを作成することです。

例としては、次のようなものがあります。

export default class RestResource {

  sendRequest() {
    // Use vue-resource or any other http library to send your request
  }

}

vueのコンポーネント1や2の中で、クラスをインポートすることでこのサービスを利用することができます。

import RestResource from './services/RestResource';

const restResourceService = new RestResource();

restResourceService.sendRequest();