Add Comments to Your Vue 2 App
これは FastComments の公式 Vue 2 ライブラリです。
Vue 2 向け FastComments のコメントウィジェット
リポジトリ
ライブデモ 
パブリックの demo テナントに対してローカルで実行されているすべてのウィジェットとフローを確認するには、リポジトリをクローンして次を実行してください：
npm install
npm run serve個別のデモはそれぞれ dev/ の下に独自のエントリポイント（npm run serve-collab-chat、serve-live-chat、serve-image-chat、serve-pagination、serve-toggle-dark-mode）も持っています。
インストール
NPM
npm install --save fastcomments-vueYarn
yarn add fastcomments-vue使い方
コメントウィジェット
FastCommentsVue コンポーネントには、ライブの FastComments コメントウィジェットが含まれています。
下の "demo" をあなたの "tenantId" に置き換えてください - tenantId は FastComments 管理画面の ここ で確認できます。
ウィジェットは多数のオプションをサポートしています - 詳細は FastCommentsConfig をこちらでご確認ください。
<script lang="ts">
import Vue from 'vue';
import FastCommentsVue from 'fastcomments-vue';
export default Vue.extend({
name: 'ServeDev',
components: {
FastCommentsVue
}
});
</script>
<template>
<div id="app">
<fast-comments-vue v-bind:config="{tenantId: 'demo'}" />
</div>
</template>現在のページを更新する（SPA の例）
FastCommentsでは、記事IDまたはコメントが紐づくページをURL IDと呼びます。これはURLまたはIDになり得ます。 以下の方法でURL IDを定義してください。コンポーネントはconfigオブジェクトの変更を監視してリロードするため、"url"と"urlId"の設定を更新するだけで構いません。
完全な動作例はこちらを参照してください。
次のコマンドでページネーションの例を実行します:
npm run serve-pagination<fast-comments-vue v-bind:config="{tenantId: 'demo', url: 'https://example.com', urlId: 'some-page-id'}" />Account Region (ATTENTION: EU Customers)
アカウントがEUにある場合は、ウィジェット設定でregion = 'eu'を設定してください。例えば:
<fast-comments-vue v-bind:config="{tenantId: 'demo', url: 'https://example.com', urlId: 'some-page-id', region: 'eu'}" />それ以外の場合はregionを定義する必要はありません。
本番環境での利用
コールバック等を渡している場合、config をインラインで定義するのはおそらく望ましくありません。代わりに、computed ブロック内で config を定義してください。そうしないと、コールバック等が呼び出されるたびにウィジェット全体が再レンダリングされます。
メンテナンス状況
これらのコンポーネントは、私たちのコアである VanillaJS コンポーネントのラッパーです。これらのコンポーネントはライブラリを公開せずに自動的に更新（バグ修正や機能追加）することができるため、このライブラリがしばらく公開されていないからといって FastComments が積極的に開発されていないというわけではありません！更新情報はお気軽に私たちのブログをご確認ください。破壊的な API の変更や機能は、このライブラリでバージョンを上げることなく基盤となるコアライブラリに組み込まれることは決してありません。
ヘルプが必要ですか？
Vue 2 ライブラリについて問題が発生した場合や質問がある場合は、次のいずれかを行ってください：
貢献
貢献は歓迎します！貢献ガイドラインについては、GitHub リポジトリ をご覧ください。