vue mathlive

يوفر Wrapper MathLive Vue مكون Vue الذي ينفذ علامة <mathlive-mathfield> html.

يمكن استخدام المكون لتحرير الصيغ باستخدام مكتبة MathLive. يوفر المحرر واجهة مستخدم غنية يمكن الوصول إليها ، بما في ذلك لوحات المفاتيح الظاهرية للهاتف المحمول ، ويمكن أن يوفر الإخراج على أنه Text LaTex أو Mathml أو Talked.

ابدء

يجب تحميل مكتبة MathLive بشكل منفصل. هذا يعطي خيار اختيار نسخة محددة من المكتبة لاستخدامها من قبل المجمع.

بعد ذلك ، يجب استيراد الغلاف ، ثم اثنين متصلان باستخدام Vue.use()

ملاحظة: يحتوي هذا المستودع فقط على العينة. يتم تعبئة غلاف Vue مع مكتبة MathLive الرئيسية.

تحذير : إذا كنت تحصل على أخطاء في وقت التشغيل عند إنشاء مكون من مكونات Mathfield وتحذير في وحدة التحكم من Vue حول "أنت تستخدم بناء وقت التشغيل فقط لـ Vue ..." تأكد من إضافة runtimeCompiler: true في تكوين Vue الخاص بك.

 < script type =" module " >
  import * as MathLive from "https://unpkg.com/mathlive/dist/mathlive.min.mjs" ;
  import VueMathfield from "https://unpkg.com/mathlive/dist/vue-mathlive.mjs" ;

  Vue . use ( VueMathfield , MathLive ) ;
</ script >

العلامة الافتراضية لـ MathFields هي <mathlive-mathfield> يمكن تعريف علامة مخصصة باستخدام:

 Vue . component ( "custom-tag" , Mathfield ) ;

يدعم المكون سمة v-model

يتم استخدام المحتوى النصي للعنصر كقيمة أولية للمحرر.

يمكن تكوين Mathfield باستخدام سمة :options ، على سبيل المثال لتحديد موقع دليل الخطوط. اقرأ المزيد عن الخيارات المتاحة.

 < mathlive-mathfield
  :options =" {smartFence:false} "
  @focus =" ping "
  :on-keystroke =" displayKeystroke "
  v-model =" formula "
>
  f(x)=
</ mathlive-mathfield >

الدعائم

اسم	يكتب	وصف
value	string	محتوى Mathfield ، ممثل كسلسلة اللاتكس.
options	object	خيارات التكوين لـ Mathfield.
onKeystroke	(keystroke:string, ev:Event) => boolean	استدعاء رد الاتصال عند الضغط على المفتاح. keystroke هي سلسلة تصف ضغط المفاتيح ، ev هو حدث لوحة المفاتيح الأصلي. العودة كاذبة للتوقف عن التعامل مع الحدث
onMoveOutOf	(string) => boolean	تم استدعاء رد الاتصال عندما يتسبب التنقل في لوحة المفاتيح إلى مغادرة نقطة الإدراج إلى Mathfield. تشير الحجة إلى اتجاه التنقل ، إما "إلى الأمام" أو "للخلف". العودة كاذبة لمنع هذه الخطوة ، صحيح أن تلتف حول بداية الحقل. بشكل افتراضي ، سوف تلتزم نقطة الإدراج.
onTabOutOf	(string) => boolean	من شأن رد الاتصال الذي تم استدعاؤه عند الضغط على علامة التبويب (أو التحول) أن يتسبب نقطة الإدراج في مغادرة Mathfield. تشير الحجة إلى اتجاه التنقل ، إما "إلى الأمام" أو "للخلف". العودة كاذبة لمنع هذه الخطوة ، صحيح أن تلتف حول بداية الحقل. بشكل افتراضي ، سوف تلتزم نقطة الإدراج.

الأحداث

اسم	وصف
focus	اكتسب مثيل المحرر تركيز المدخلات.
blur	فقدت مثيل المحرر تركيز المدخلات.
input	لقد تغير محتوى Mathfield. معلمة الحدث هي القيمة الجديدة كسلسلة
selection-will-change	اختيار Mathfield على وشك التغيير
undo-state-will-change	حالة التراجع على وشك التغيير
undo-state-did-change	لقد تغيرت حالة التراجع
virtual-keyboard-toggle	لقد تغيرت رؤية لوحة المفاتيح الافتراضية. الحجة الأولى هي منطقية تشير إلى ما إذا كانت لوحة المفاتيح مرئية الآن. الوسيطة الثانية هي عنصر DOM يحتوي على لوحة المفاتيح الظاهرية.
read-aloud-status	لقد تغيرت حالة القراءة بصوت عال. الوسيطة الأولى هي سلسلة تشير إلى الحالة الجديدة.

طُرق

اسم	وصف
perform(selector:string)	تنفيذ إجراء ، كما هو موضح من قبل المحدد.
hasFocus(): boolean	صحيح إذا كان Mathfield يركز
focus()	اضبط التركيز على Mathfield
blur()	قم بإزالة التركيز من Mathfield
text(format:string): string	إرجاع محتوى Mathfield كسلسلة بالتنسيق المحدد: "latex" ، "latex-expanded" (يتم توسيع جميع وحدات الماكرو اللاتكس إلى تعريفها) ، "spoken" ، "mathML"
selectedText(format:string): string	مثل text() ، ولكن فقط للاختيار الحالي.
insert(content:string, options:object)	options.insertionMode = 'replaceSelection' (افتراضي) ، 'replaceAll' ، 'insertBefore' ، 'insertAfter' options.selectionMode - يصف المكان الذي سيكون فيه الاختيار بعد الإدراج: 'placeholder' : سيكون الاختيار أول عنصر نائب متاح في العنصر الذي تم إدخاله) (افتراضيًا) ، 'after' 'before' : سيكون الاختيار نقطة إدراج بعد أن تم إدراج العنصر "(تم تحديد العنصر). options.placeholder - السلسلة النائبة ، إذا لزم الأمر options.format s 'auto' 'latex' options.smartFence ( left...right mleft...mright options.suppressChangeNotifications . الافتراضي false .
keystroke(keys:string, evt:Event)	محاكاة مستخدم يضغط على مجموعة مفاتيح
typedText(text:string)	محاكاة المستخدم يكتب بعض النص.
selectionIsCollapsed():boolean	صحيح إذا انهار الاختيار ، أي نقطة الإدراج الفردي
selectionDepth():number	إرجاع عمق مجموعة الاختيار. إذا كان التحديد على مستوى الجذر ، فالإرجاع 0. إذا كان التحديد جزءًا من البسط للكسر الذي يكون على مستوى الجذر ، فاحرص على ذلك. لاحظ أنه في هذه الحالة ، سيكون البسط "مجموعة الاختيار"
selectionAtStart():boolean	إرجاع صحيح إذا بدأ التحديد في بداية مجموعة الاختيار
selectionAtEnd():boolean	إرجاع صحيح إذا امتدت التحديد إلى نهاية مجموعة الاختيار
select()	حدد محتوى Mathfield

المختارون

يمكن تمرير المختارين إلى [ Mathfield.executeCommand() ] {@Link Mathfield#Executecommand} لتنفيذ أوامر مختلفة. يمكن أن ترتبط أيضًا بالمفاتيح في لوحة المفاتيح الظاهرية.

انظر {Tutorial Selectors} للحصول على قائمة بجميع المحددات.