تخطَّ إلى المحتوى

Vue

مكوّن يدعم v-model لـ Vue 3.3 فما فوق، وآمن مع التصيير على الخادم.

في هذه الصفحة
الحزمة@open-wysiwyg-editor/vue(يفتح في تبويب جديد)يتطلب Vue 3.3+

التثبيت

الطرفية
npm install @open-wysiwyg-editor/vue

الاستخدام

<script setup lang="ts">
import { ref } from "vue";
import { RichTextEditor } from "@open-wysiwyg-editor/vue";
import "@open-wysiwyg-editor/vue/style.css";

const html = ref("<p>Hello <strong>world</strong></p>");
</script>

<template>
  <RichTextEditor v-model="html" placeholder="Write something…" />
</template>

معلومات مفيدة

  • يقبل options كل ما يقبله createEditor() عدا element. تتبع دوال الاستدعاء والخيارات الديناميكية التغييرات، ويُقرأ الباقي عند التركيب، فأعد التركيب بـ :key جديد.
  • يبدأ المحرّر في onMounted، فيعمل في Nuxt وVite SSR دون <ClientOnly>.
  • الأحداث: update:modelValue (‏HTML) وready (المحرّر). ويكشف مرجع القالب الخاصية editor.

عقّم دائمًا على الخادم

يعقّم المحرّر ما يحمّله وما ينتجه، لكن هذا ليس حدًّا أمنيًا: يستطيع أي شخص إرسال أي نص إلى واجهتك البرمجية. عقّم الـ HTML مرة أخرى بمكتبة تثق بها قبل تخزينه أو عرضه لمستخدمين آخرين.

عدّل هذه الصفحة على GitHub