Add Comments to Your Vue 3 App
Dies ist die offizielle Vue 3-Bibliothek für FastComments.
Integrieren Sie Live-Kommentare, Chat- und Bewertungs-Widgets in Ihre Vue-App.
Repository
Live-Demo 
Probieren Sie jedes Widget live unter https://fastcomments.com/commenting-system-for-vue.
Live-Präsentation
Um jedes Widget und jeden Flow zu sehen, die lokal gegen den öffentlichen demo-Tenant laufen, klonen Sie das Repo und führen Sie aus:
npm install
npm run devDer Einstiegspunkt der Demo befindet sich in src/App.vue und index.html — jedes Widget/Flow wird in derselben App gerendert, die Sie in Ihr eigenes Vue 3-Projekt kopieren können.
Installation
NPM
npm install --save fastcomments-vue-nextYarn
yarn add fastcomments-vue-nextVerwendung
Das Kommentar-Widget
Die Komponente FastCommentsVueNext enthält das Live-Kommentar-Widget von FastComments.
Ersetze "demo" unten durch deine "tenantId" - verfügbar hier im Admin-Bereich von FastComments.
Das Widget unterstützt viele Optionen - siehe FastCommentsConfig hier.
<template>
<FastComments v-bind:config="{tenantId: 'demo'}" />
</template>
<script>
import { FastComments } from 'fastcomments-vue-next'
export default {
name: 'FastCommentsExample',
components: {
FastComments
}
}
</script>Aktualisierung der aktuellen Seite (SPA-Beispiel)
Bei FastComments nennen wir die Artikel-ID oder die Seite, an die die Kommentare gebunden sind, die URL-ID, da es sich um eine url oder eine ID handeln kann. Definieren Sie die URL-ID wie folgt. Die Komponente beobachtet Änderungen am config-Objekt und lädt neu, sodass Sie die URL-ID aktualisieren können.
<FastComments v-bind:config="{tenantId: 'demo', url: 'https://example.com/somepage', urlId: 'some-page-id'}" />Kontoregion (ACHTUNG: EU-Kunden)
Wenn sich Ihr Konto in der EU befindet, setzen Sie region = 'eu' in der Widget-Konfiguration, zum Beispiel:
<FastComments v-bind:config="{tenantId: 'demo', url: 'https://example.com/somepage', urlId: 'some-page-id', region: 'eu'}" />Andernfalls müssen Sie region nicht definieren.
In Produktion
Sie möchten die Konfiguration wahrscheinlich nicht inline definieren, wenn Sie Callbacks usw. übergeben. Stattdessen sollten Sie
die Konfiguration über computed() definieren, andernfalls wird das gesamte Widget jedes Mal neu gerendert, wenn Ihr Callback usw. aufgerufen wird.
Alle Widgets und Dokumentation
Lokale Dokumentation ausführen:
npm run serveWartungsstatus
Diese Komponenten sind Wrapper um unsere Kern-VanillaJS-Komponenten. Wir können diese Komponenten automatisch aktualisieren (Fehler beheben, Funktionen hinzufügen), ohne diese Bibliothek zu veröffentlichen, sodass, auch wenn sie möglicherweise eine Zeit lang nicht veröffentlicht wird, dies nicht bedeutet, dass FastComments nicht aktiv weiterentwickelt wird! Schauen Sie gerne in unseren Blog für Updates. Breaking-API-Änderungen oder Funktionen werden niemals in die zugrunde liegende Kernbibliothek ausgeliefert, ohne eine Versionsanhebung in dieser Bibliothek.
FastComments
FastComments
Diese Dokumentation enthält einige Beispiele dafür, wie man FastComments mit Vue3 verwendet.
Für eine vollständige Liste der Konfigurationsoptionen siehe fastcomments-typescript und unsere Dokumentation.
Brauchen Sie Hilfe?
Wenn Sie auf Probleme stoßen oder Fragen zur Vue 3-Bibliothek haben, tun Sie bitte Folgendes:
Mitwirken
Beiträge sind willkommen! Bitte besuchen Sie das GitHub-Repository für Richtlinien zur Mitwirkung.