جدول توضيح مكونات تطبيقات وي شات الصغيرة

基础组件

الإطار يوفر مجموعة من المكونات الأساسية للمطورين، حيث يمكن للمطورين الاستفادة من تركيب هذه المكونات الأساسية للتطوير السريع.

ما هي المكونات:

<tagname property="value">
  Content goes here ...
</tagename>

属性类型

نوع وصف تعليق
Boolean قيمة منطقية عندما يتم كتابة هذه الخاصية على المكون، بغض النظر عن قيمة هذه الخاصية، فإن قيمتها تكون دائمًا `true`. إذا لم يتم كتابة هذه الخاصية على المكون، فإن قيمة الخاصية تكون `false`. إذا كانت قيمة الخاصية عبارة عن متغير، فسيتم تحويل قيمة المتغير إلى نوع `Boolean`.
Number رقم 1, 2.5
String سلسلة نصية “string”
Array مصفوفة [ 1, “string” ]
Object هدف { key: value }
EventHandler اسم وظيفة معالج الأحداث "handlerName" هو اسم وظيفة معالج الأحداث المعرفة في الصفحة
Any أي خاصية
共同属性类型
خصائص نوع وصف تعليق
id String المعرف الفريد للمكون الحفاظ على الصفحة ككل فريدة
class String فئات الأنماط للمكونات الأنماط المحددة في ملف WXSS المقابل
style String الأنماط الداخلية للمكون الأنماط الداخلية القابلة للضبط الديناميكي
hidden String هل يتم عرض المكون؟ يتم عرض جميع المكونات افتراضيًا.
data-* Any الخصائص المخصصة عند تشغيل الحدث على المكون، سيتم إرساله إلى وظيفة معالجة الأحداث.
bind* / catch* EventHandler أحداث المكونات

基本组件列表

تنقسم المكونات الأساسية إلى الفئات التالية:

حاوية العرض (View Container) المحتوى الأساسي (Basic Content) نموذج (Form) الملاحة وسائط متعددة (Media) خريطة (Map) لوحة الرسم (Canvas)

视图容器(View Container):

اسم المكون تعليق خصائص المكون
اسم السمة نوع القيمة الافتراضية شرح الإصدار الأدنى
view حاوية العرض hover-class String none 指定按下去的样式类。当 hover-class="none" 时,没有点击态效果
hover-stop-propagation Boolean false حدد ما إذا كان سيتم منع ظهور حالة النقر على العقد الأصلية لهذه العقدة. 1.5.0
hover-start-time Number 50 كم من الوقت يجب أن يمر قبل ظهور حالة النقر، بالمللي ثانية
hover-stay-time Number 400 مدة الاحتفاظ بالنقر بعد تحرير الإصبع، بوحدة مللي ثانية
scroll-view حاوية مشاهدة قابلة للتمرير scroll-x Boolean false السماح بالتمرير الأفقي
scroll-y Boolean false السماح بالتمرير العمودي
upper-threshold Number 50 عندما يكون المسافة إلى الأعلى/اليسار (بوحدة px)، يتم تشغيل حدث scrolltoupper.
lower-threshold Number 50 متى يتم تشغيل حدث scrolltolower عندما يكون المسافة إلى الأسفل/اليمين (بوحدة px)؟
scroll-top Number تعيين موضع شريط التمرير العمودي
scroll-left Number تعيين موضع شريط التمرير الأفقي
scroll-into-view String يجب أن تكون القيمة هي معرف عنصر فرعي (لا يمكن أن يبدأ المعرف برقم). سيتم التمرير في الاتجاه الذي تم تعيينه للتمرير فيه إلى هذا العنصر.
scroll-with-animation Boolean false عند تعيين موضع شريط التمرير، استخدم الانتقال المتحرك.
enable-back-to-top Boolean false عند النقر على شريط الحالة العلوي في iOS أو النقر مرتين على شريط العنوان في Android، يعود الشريط المتحرك إلى الأعلى، ولكن يدعم فقط الاتجاه الرأسي.
bindscrolltoupper EventHandle التمرير إلى الأعلى/اليسار، سيؤدي إلى تشغيل حدث scrolltoupper.
bindscrolltolower EventHandle سيتم تشغيل حدث scrolltolower عند التمرير إلى الأسفل/اليمين.
bindscroll EventHandle يتم تشغيله عند التمرير، event.detail = {scrollLeft, scrollTop, scrollHeight, scrollWidth, deltaX, deltaY}
swiper حاوية مشاهدة الشريط المنزلق indicator-dots Boolean false هل تظهر نقاط مؤشر اللوحة؟
indicator-color Color rgba(0, 0, 0, .3) لون نقطة التوجيه 1.1.0
indicator-active-color Color #000000 لون النقطة المحددة حاليًا 1.1.0
autoplay Boolean false هل يتم التبديل تلقائيًا؟
current Number 0 فهرس الصفحة الحالية
interval Number 5000 فاصل الوقت التلقائي للتبديل
duration Number 500 مدة الرسوم المتحركة للتمرير
circular Boolean false هل تعتمد الانزلاق المتصل؟
vertical Boolean false هل اتجاه التمرير عمودي؟
bindchange EventHandle عندما يتغير الحالي، يتم تشغيل حدث التغيير، ويكون تفاصيل الحدث كالتالي: {current: الحالي, source: المصدر}

基础内容(Basic Content):

اسم المكون تعليق خصائص المكون
اسم السمة نوع القيمة الافتراضية شرح الإصدار الأدنى
icon 图标 type String icon的类型,有效值:success, success_no_circle, info, warn, waiting, cancel, download, search, clear
size Number 23 حجم الأيقونة، وحدة بكسل
color Color لون الأيقونة، كما لون CSS
text نص selectable Boolean false هل يمكن اختيار النص؟ 1.1.0
space String false 显示连续空格
有效值 ensp:中文字符空格一半大小 emsp:中文字符空格大小 nbsp:根据字体设置的空格大小
1.4.0
decode Boolean false هل تم فك التشفير؟ 1.4.0
progress شريط التقدم percent Float لا شيء النسبة المئوية 0~100
show-info Boolean false عرض النسبة المئوية على يمين شريط التقدم
stroke-width Number 6 عرض خط شريط التقدم، وحدة بكسل
color Color #09BB07 لون شريط التقدم (يرجى استخدام activeColor)
activeColor Color لون شريط التقدم المحدد
backgroundColor Color لون شريط التقدم غير المحدد
active Boolean false رسوم متحركة لشريط التقدم من اليسار إلى اليمين
active-mode String backwards عكس الاتجاه: الرسوم المتحركة تبدأ من البداية؛ إلى الأمام: الرسوم المتحركة تستأنف من النقطة التي توقفت عندها آخر مرة. 1.7.0

表单(Form):

اسم المكون تعليق خصائص المكون
اسم السمة نوع القيمة الافتراضية شرح وقت السريان الإصدار الأدنى
button زر size String default حجم الزر
type String default أنواع نمط الزر
plain Boolean false هل الزر محفور ولون خلفية معتم؟
disabled Boolean false هل يجب تعطيله؟
loading Boolean false هل يتم إضافة رمز التحميل قبل الاسم؟
form-type String 用于 <form/> 组件,点击分别会触发 <form/> 组件的 submit/reset 事件
open-type String قدرات الوصول المفتوحة لواتساب 1.1.0
hover-class String button-hover 指定按钮按下去的样式类。当 hover-class="none" 时,没有点击态效果
hover-stop-propagation Boolean false حدد ما إذا كان سيتم منع ظهور حالة النقر على العقد الأصلية لهذه العقدة. 1.5.0
hover-start-time Number 20 كم من الوقت يجب أن يمر قبل ظهور حالة النقر، بالمللي ثانية
hover-stay-time Number 70 مدة الاحتفاظ بالنقر بعد تحرير الإصبع، بوحدة مللي ثانية
bindgetuserinfo Handler عندما ينقر المستخدم على هذا الزر، سيتم إرجاع معلومات المستخدم التي تم الحصول عليها، ويتم الحصول على القيمة من المعلمة "detail" في النتيجة المرتجعة كما هو الحال مع wx.getUserInfo. open-type="getUserInfo' 1.3.0
lang String en تحديد لغة المعلومات التي يتم إرجاعها للمستخدم، zh_CN للغة الصينية المبسطة، zh_TW للغة الصينية التقليدية، en للغة الإنجليزية. open-type="getUserInfo" 1.3.0
session-from String مصدر المحادثة open-type="contact" 1.4.0
send-message-title String العنوان الحالي عنوان بطاقة الرسائل داخل المحادثة open-type="contact" 1.5.0
send-message-path String مسار المشاركة الحالي مسار الانتقال إلى التطبيق الصغير عند النقر على بطاقة الرسالة في المحادثة open-type="contact" 1.5.0
send-message-img String لقطة شاشة بطاقة الصورة للرسائل داخل المحادثة open-type="contact" 1.5.0
show-message-card Boolean false عرض بطاقات الرسائل داخل الدردشة open-type="contact" 1.5.0
bindcontact Handler استدعاء رد الرسالة للعملاء open-type="contact" 1.5.0
bindgetphonenumber Handler استرجاع رقم هاتف المستخدم الاستدعاء open-type="getphonenumber" 1.2.0
form نموذج report-submit Boolean هل ترجع formId لإرسال رسائل القوالب؟
bindsubmit EventHandle تشغيل حدث الإرسال مع بيانات النموذج، event.detail = {value : {'name': 'value'} , formId: ''}
bindreset EventHandle يتم تشغيل حدث الإعادة تعيين عند إعادة تعيين النموذج.
input مربع الإدخال value String محتوى الإدخال الأولي
type String "text" نوع الإدخال
password Boolean false هل هو نوع كلمة المرور
placeholder String عندما يكون مربع الإدخال فارغًا، يظهر العنصر النائب.
placeholder-style String إعداد نمط العنصر النائب
placeholder-class String "input-placeholder" فئة النمط لعنصر العنصر النائب
disabled Boolean false هل يجب تعطيله؟
maxlength Number 140 الحد الأقصى لطول الإدخال، عند تعيينه على -1، لا يوجد حد أقصى للطول.
cursor-spacing Number 0 تحديد المسافة بين المؤشر ولوحة المفاتيح، بوحدة px. يتم أخذ الحد الأدنى من المسافة بين الإدخال والجزء السفلي والمسافة المحددة بواسطة cursor-spacing كمسافة بين المؤشر ولوحة المفاتيح.
auto-focus Boolean false (سيتم الإهمال قريبًا، يرجى استخدام focus مباشرة) التركيز التلقائي، إحضار لوحة المفاتيح
focus Boolean false الحصول على التركيز
confirm-type String "done" ضبط نص الزر الموجود في أسفل يمين لوحة المفاتيح 1.1.0
confirm-hold Boolean false هل تريد الحفاظ على لوحة المفاتيح مفتوحة عند النقر على الزر الموجود في أسفل يمين لوحة المفاتيح؟ 1.1.0
cursor Number موضع المؤشر عند تحديد التركيز 1.5.0
bindinput EventHandle عندما يتم إدخال النص على لوحة المفاتيح، يتم تشغيل حدث الإدخال، حيث يكون `event.detail = {value, cursor}`، ويمكن لدالة المعالجة أن تعيد مباشرةً سلسلة نصية تحل محل محتوى مربع الإدخال.
bindfocus EventHandle يتم تشغيله عند تركيز مربع الإدخال، event.detail = {value: value}
bindblur EventHandle يتم تشغيله عندما يفقد مربع الإدخال التركيز، event.detail = {value: value}
bindconfirm EventHandle يتم تشغيله عند النقر فوق زر الإكمال، event.detail = {value: value}
checkbox محدد متعدد الخيارات value String <checkbox/>标识,选中时触发<checkbox-group/>的 change 事件,并携带 <checkbox/> 的 value
disabled Boolean false هل يجب تعطيله؟
checked Boolean false هل يتم تحديده حاليًا، يمكن استخدامه لتعيين التحديد الافتراضي.
color Color لون خانة الاختيار، نفس لون الخاصية color في CSS
radio محدد الاختيار الفردي value String <radio/> 标识。当该<radio/> 选中时,<radio-group/> 的 change 事件会携带<radio/>的value
disabled Boolean false هل يجب تعطيله؟
checked Boolean false هل يتم تحديده حاليًا، يمكن استخدامه لتعيين التحديد الافتراضي.
color Color لون الراديو، كما لون CSS
picker
(mode = selector)
(عادي) محدد القائمة range Array / Object Array [] عندما تكون الوضع هو "محدد" أو "متعدد المحددات"، يكون النطاق صالحًا.
range-key String عندما يكون `range` مصفوفة من الكائنات، يمكنك تحديد قيمة `key` في الكائن عن طريق `range-key` لتعيينها كمحتوى عرض المحدد.
value Number 0 قيمة value تشير إلى العنصر الذي تم اختياره من النطاق range (بدءًا من الفهرس 0).
bindchange EventHandle عند تغيير القيمة، يتم تشغيل حدث "change"، ويكون event.detail = {value: value}
disabled Boolean false هل يجب تعطيله؟
picker
(mode = multiSelector)
محدد القائمة (متعدد الأعمدة) range مصفوفة ثنائية الأبعاد / مصفوفة كائنات ثنائية الأبعاد [] mode为 selector 或 multiSelector 时,range 有效。二维数组,长度表示多少列,数组的每项表示每列的数据,如[["a","b"], ["c","d"]]
range-key String عندما يكون `range` مصفوفة ثنائية من الكائنات، يمكنك استخدام `range-key` لتحديد قيمة الـ `key` داخل الكائن كمحتوى عرض للمحدد.
value Array 0 قيمة كل عنصر تشير إلى الترتيب الذي تم اختياره من العنصر المقابل في النطاق (بدءًا من الفهرس 0).
bindchange EventHandle عند تغيير القيمة، يتم تشغيل حدث "change"، ويكون event.detail = {value: value}
bindcolumnchange EventHandle عند تغيير قيمة أي عمود، يتم تشغيل حدث columnchange، حيث event.detail = {column: column, value: value}، وتشير قيمة column إلى رقم العمود الذي تم تغييره (بدءًا من الفهرس 0)، وتشير قيمة value إلى فهرس القيمة المُعدّلة.
disabled Boolean false هل يجب تعطيله؟
picker
(mode = time)
محدد القائمة (الوقت) value String 表示选中的时间,格式为"hh:mm"
start String 表示有效时间范围的开始,字符串格式为"hh:mm"
end String 表示有效时间范围的结束,字符串格式为"hh:mm"
bindchange EventHandle عند تغيير القيمة، يتم تشغيل حدث "change"، ويكون event.detail = {value: value}
disabled Boolean false هل يجب تعطيله؟
picker
(mode = date)
محدد التاريخ value String 0 表示选中的日期,格式为"YYYY-MM-DD"
start String 表示有效日期范围的开始,字符串格式为"YYYY-MM-DD"
end String 表示有效日期范围的结束,字符串格式为"YYYY-MM-DD"
fields String day القيمة الفعالة year, month, day، تشير إلى دقة المحدد.
bindchange EventHandle عند تغيير القيمة، يتم تشغيل حدث "change"، ويكون event.detail = {value: value}
disabled Boolean false هل يجب تعطيله؟
picker
(mode = region)
محدد التاريخ value Array [] يشير إلى المقاطعة والمدينة والحي المحددة، ويتم اختيار القيمة الأولى في كل عمود بشكل افتراضي.
custom-item String يمكن إضافة عنصر مخصص في أعلى كل عمود. 1.5.0
bindchange EventHandle عند تغيير القيمة، يتم تشغيل حدث "change"، ويكون event.detail = {value: value}
disabled Boolean false هل يجب تعطيله؟
picker-view محدد القائمة المضمنة value NumberArray الأرقام في المصفوفة تمثل بالترتيب العنصر المحدد في picker-view-colume داخل picker-view (الفهرس يبدأ من 0)، عندما يكون الرقم أكبر من طول خيارات picker-view-column، يتم اختيار العنصر الأخير.
indicator-style String تعديل نمط الصندوق المحدد في وسط المحدد
indicator-class String تعيين اسم الفئة للصندوق المحدد في وسط المحدد 1.1.0
mask-style String ضبط نمط الغموض 1.5.0
mask-class String اسم الفئة للطبقة الظليلة 1.5.0
bindchange EventHandle عند التمرير للاختيار، عندما يتغير القيمة، يتم تشغيل حدث التغيير، حيث يكون `event.detail = {value: value}`؛ القيمة هي مصفوفة، تمثل العنصر المحدد حاليًا في `picker-view-column` داخل `picker-view` (الفهرس يبدأ من 0).
slider محدد التمرير min Number 0 الحد الأدنى
max Number 100 الحد الأقصى
step Number 0 الخطوة، يجب أن تكون القيمة أكبر من 0، ويمكن قسمتها على (max - min) بدون باقي.
disabled Boolean false هل يجب تعطيله؟
value Number 0 القيمة الحالية
color Color #e9e9e9 لون خلفية الشريط (يرجى استخدام backgroundColor)
selected-color Color #1aad19 اللون المحدد (يرجى استخدام activeColor)
activeColor Color #1aad19 اللون المختار
backgroundColor Color #e9e9e9 لون خلفية الشريط
show-value Boolean false هل تعرض القيمة الحالية؟
bindchange EventHandle الحدث الذي يتم تشغيله بعد إكمال عملية سحب واحدة، event.detail = {value: value}
bindchanging EventHandle الأحداث التي تم إطلاقها أثناء السحب، event.detail = {value: value} 1.7.0
switch محدد التبديل checked Boolean false هل تم اختياره؟
type String switch النمط، القيم الصالحة: زر التبديل، خانة الاختيار
bindchange EventHandle تم تشغيل حدث التغيير عند تغيير القيمة checked، وتفاصيل الحدث هي: { value: checked }
color Color لون الـ switch، كما في خاصية color في CSS
label وسم for String ربط معرف العنصر التحكم

导航(Navigation):

اسم المكون تعليق خصائص المكون
اسم السمة نوع القيمة الافتراضية شرح الإصدار الأدنى
navigator رابط التطبيق url String روابط الانتقال داخل التطبيق
open-type String navigate طريقة الانتقال
delta Number صالح عندما يكون النوع المفتوح هو 'navigateBack'، ويشير إلى عدد الطبقات التي يتم العودة منها.
hover-class String navigator-hover 指定点击时的样式类,当hover-class="none"时,没有点击态效果
hover-stop-propagation Boolean false حدد ما إذا كان سيتم منع ظهور حالة النقر على العقد الأصلية لهذه العقدة. 1.5.0
hover-start-time Number 50 كم من الوقت يجب أن يمر قبل ظهور حالة النقر، بالمللي ثانية
hover-stay-time Number 600 مدة الاحتفاظ بالنقر بعد تحرير الإصبع، بوحدة مللي ثانية
其中open-type 的有效值如下:
قيمة شرح الإصدار الأدنى
navigate الوظيفة المقابلة لـ wx.navigateTo
redirect الوظيفة المقابلة لـ wx.redirectTo
switchTab الوظيفة المقابلة لـ wx.switchTab
reLaunch الوظيفة المقابلة لـ wx.reLaunch 1.1.0
navigateBack الوظيفة المقابلة لـ wx.navigateBack 1.1.0

多媒体(Media):

اسم المكون تعليق خصائص المكون
اسم السمة نوع القيمة الافتراضية شرح الإصدار الأدنى
audio صوت id String المعرّف الفريد لمكون الصوت
src String عنوان مصدر المورد لتشغيل الصوت
loop Boolean false هل تكرار التشغيل؟
controls Boolean false هل تعرض الأدوات الافتراضية؟
poster String عنوان مصدر صورة الغلاف الصوتي على الأداة الافتراضية، إذا كانت قيمة السمة `controls` هي `false`، فإن تعيين `poster` لا يكون فعالاً.
name String صوت غير معروف اسم الصوت على الأداة الافتراضية، إذا كانت قيمة السمة controls هي false، فإن تعيين الاسم سيكون غير فعال.
author String المؤلف غير معروف اسم المؤلف على العنصر الإفتراضي، إذا كانت قيمة الخاصية controls هي false، فإن تعيين author سيكون غير فعال.
binderror EventHandle عند حدوث خطأ، يتم تشغيل حدث الخطأ، التفاصيل = {errMsg: MediaError.code}
bindplay EventHandle يتم تشغيل حدث التشغيل عند البدء/الاستمرار في التشغيل
bindpause EventHandle عند إيقاف التشغيل مؤقتًا، يتم تشغيل حدث الإيقاف المؤقت.
bindtimeupdate EventHandle يتم تشغيل حدث `timeupdate` عند تغيير تقدم التشغيل، ويكون التفاصيل كالتالي: `{currentTime, duration}`
bindended EventHandle عند الوصول إلى نهاية التشغيل، يتم تشغيل حدث "ended".
image صورة src String عنوان مصدر الصورة
mode String 'scaleToFill' وضع القص والتكبير/التصغير للصورة
lazy-load Boolean false التحميل البطيء للصور. يعمل فقط مع الصور الموجودة في الصفحة وعناصر التمرير. 1.5.0
binderror HandleEvent عند حدوث خطأ، يتم نشر اسم الحدث إلى AppService، ويكون كائن الحدث event.detail = {errMsg: 'something wrong'}
bindload HandleEvent عند اكتمال تحميل الصورة، يتم نشر الحدث إلى AppService باسم الحدث، ويكون كائن الحدث event.detail = {height:'ارتفاع الصورة بالبكسل', width:'عرض الصورة بالبكسل'}
video فيديو src String عنوان مصدر الفيديو المراد تشغيله
initial-time Number تحديد موضع بدء تشغيل الفيديو 1.6.0
duration Number مدة الفيديو المحددة 1.1.0
controls Boolean true هل تريد عرض عناصر التحكم الافتراضية للتشغيل (زر التشغيل/الإيقاف المؤقت، مؤشر تقدم التشغيل، الوقت)؟
danmu-list Object Array قائمة التعليقات المتحركة
danmu-btn Boolean false هل يتم عرض زر التعليقات المتحركة، فقط في التهيئة الأولية، ولا يمكن تغييرها ديناميكيًا.
enable-danmu Boolean false هل تعرض التعليقات المتحركة، فقط صالحة في التهيئة الأولية، ولا يمكن تغييرها ديناميكيًا.
autoplay Boolean false هل يتم التشغيل التلقائي
loop Boolean false هل تكرار التشغيل؟ 1.4.0
muted Boolean false هل ترغب في تشغيل الصوت بدون صوت؟ 1.4.0
page-gesture Boolean false هل تريد تفعيل إيماض تعديل السطوع والصوت في وضع غير ملء الشاشة؟ 1.6.0
direction Number ضبط اتجاه الفيديو عند التحجيم الكامل، وإذا لم يتم تحديده، فسيتم تحديده تلقائيًا وفقًا لنسبة العرض إلى الارتفاع. القيم الصالحة هي 0 (عمودي عادي)، 90 (شاشة مقلوبة بزاوية 90 درجة عكس اتجاه عقارب الساعة)، -90 (شاشة مقلوبة بزاوية 90 درجة باتجاه عقارب الساعة). 1.7.0
bindplay EventHandle يتم تشغيل حدث التشغيل عند البدء/الاستمرار في التشغيل
bindpause EventHandle عند إيقاف التشغيل مؤقتًا، يتم تشغيل حدث الإيقاف المؤقت.
bindended EventHandle عند الوصول إلى نهاية التشغيل، يتم تشغيل حدث "ended".
bindtimeupdate EventHandle يتم تشغيله عند تغيير تقدم التشغيل، event.detail = {currentTime, duration} . تردد التشغيل 250 مللي ثانية مرة واحدة.
bindfullscreenchange EventHandle عندما يدخل الفيديو أو يخرج من وضع الشاشة الكاملة، يتم تشغيل الحدث، event.detail = {fullScreen, direction}، حيث يأخذ الاتجاه القيمة vertical أو horizontal. 1.4.0
objectFit String contain عندما يكون حجم الفيديو مختلفًا عن حجم حاوية الفيديو، يكون شكل عرض الفيديو. contain: تضمين، fill: ملء، cover: تغطية
poster String عنوان مصدر الصورة لغلاف الفيديو، إذا كانت قيمة السمة controls هي false، فإن تعيين السمة poster سيكون غير فعال.

地图(Map):

اسم المكون تعليق خصائص المكون
اسم السمة نوع القيمة الافتراضية شرح الإصدار الأدنى
map خريطة longitude Number خط طول المركز
latitude Number عرض خط الطول المركزي
scale Number 16 مستوى التكبير، النطاق المسموح به من 5 إلى 18
markers Array نقطة التعليم
covers Array سيتم إزالته قريبًا، يرجى استخدام العلامات
polyline Array المسار
circles Array دائرة
controls Array عناصر التحكم
include-points Array تكبير الرؤية لتشمل جميع النقاط المعطاة
show-location Boolean عرض النقطة الجغرافية الحالية مع الاتجاه
bindmarkertap EventHandle يتم تشغيله عند النقر على نقطة العلامة.
bindcallouttap EventHandle يتم تشغيله عند النقر على الفقاعة المقابلة لنقطة العلامة. 1.2.0
bindcontroltap EventHandle تم تشغيله عند النقر على العنصر التحكمي
bindregionchange EventHandle يتم تشغيله عند تغيير الرؤية
bindtap EventHandle تفعيل عند النقر على الخريطة
bindupdated EventHandle يتم تشغيله عند اكتمال تحديث عرض الخريطة. 1.6.0

画布(Canvas):

اسم المكون تعليق خصائص المكون
اسم السمة نوع القيمة الافتراضية شرح الإصدار الأدنى
canvas لوحة الرسم src String عنوان مصدر الفيديو المراد تشغيله
initial-time Number تحديد موضع بدء تشغيل الفيديو 1.6.0
duration Number مدة الفيديو المحددة 1.1.0
controls Boolean true هل تريد عرض عناصر التحكم الافتراضية للتشغيل (زر التشغيل/الإيقاف المؤقت، مؤشر تقدم التشغيل، الوقت)؟
danmu-list Object Array قائمة التعليقات المتحركة
danmu-btn Boolean false هل يتم عرض زر التعليقات المتحركة، فقط في التهيئة الأولية، ولا يمكن تغييرها ديناميكيًا.
enable-danmu Boolean false هل تعرض التعليقات المتحركة، فقط صالحة في التهيئة الأولية، ولا يمكن تغييرها ديناميكيًا.
autoplay Boolean false هل يتم التشغيل التلقائي
loop Boolean false هل تكرار التشغيل؟ 1.4.0
muted Boolean false هل ترغب في تشغيل الصوت بدون صوت؟ 1.4.0
page-gesture Boolean false هل تريد تفعيل إيماض تعديل السطوع والصوت في وضع غير ملء الشاشة؟ 1.6.0
direction Number ضبط اتجاه الفيديو عند التحجيم الكامل، وإذا لم يتم تحديده، فسيتم تحديده تلقائيًا وفقًا لنسبة العرض إلى الارتفاع. القيم الصالحة هي 0 (عمودي عادي)، 90 (شاشة مقلوبة بزاوية 90 درجة عكس اتجاه عقارب الساعة)، -90 (شاشة مقلوبة بزاوية 90 درجة باتجاه عقارب الساعة). 1.7.0
show-progress Boolean true إذا لم يتم الإعداد، فسيتم عرضه فقط عندما يكون العرض أكبر من 240. 1.9.0
show-fullscreen-btn Boolean true هل تظهر زر الشاشة الكاملة 1.9.0
show-play-btn Boolean true هل تظهر زر التشغيل في شريط التحكم في أسفل الفيديو؟ 1.9.0
show-center-play-btn Boolean true هل تظهر زر التشغيل في وسط الفيديو؟ 1.9.0
enable-progress-gesture Boolean true هل تريد تفعيل إيماءات التحكم في المسار؟ 1.9.0
bindplay EventHandle يتم تشغيل حدث التشغيل عند البدء/الاستمرار في التشغيل
bindpause EventHandle عند إيقاف التشغيل مؤقتًا، يتم تشغيل حدث الإيقاف المؤقت.
bindended EventHandle عند الوصول إلى نهاية التشغيل، يتم تشغيل حدث "ended".
bindtimeupdate EventHandle يتم تشغيله عند تغيير تقدم التشغيل، event.detail = {currentTime, duration} . تردد التشغيل 250 مللي ثانية مرة واحدة.
bindfullscreenchange EventHandle عندما يدخل الفيديو أو يخرج من وضع الشاشة الكاملة، يتم تشغيل الحدث، event.detail = {fullScreen, direction}، حيث يأخذ الاتجاه القيمة vertical أو horizontal. 1.4.0
objectFit String contain عندما يكون حجم الفيديو مختلفًا عن حجم حاوية الفيديو، يكون شكل عرض الفيديو. contain: تضمين، fill: ملء، cover: تغطية
poster String عنوان مصدر الصورة لغلاف الفيديو، إذا كانت قيمة السمة controls هي false، فإن تعيين السمة poster سيكون غير فعال.

لقد استخدمت مؤخرًا:

جمع قائمة الطعام QQ