الإطار يوفر مجموعة من المكونات الأساسية للمطورين، حيث يمكن للمطورين الاستفادة من تركيب هذه المكونات الأساسية للتطوير السريع.
<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 | حاوية العرض | 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: المصدر} |
اسم المكون | تعليق | خصائص المكون | ||||
---|---|---|---|---|---|---|
اسم السمة | نوع | القيمة الافتراضية | شرح | الإصدار الأدنى | ||
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 |
اسم المكون | تعليق | خصائص المكون | |||||
---|---|---|---|---|---|---|---|
اسم السمة | نوع | القيمة الافتراضية | شرح | وقت السريان | الإصدار الأدنى | ||
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 | ربط معرف العنصر التحكم |
اسم المكون | تعليق | خصائص المكون | ||||
---|---|---|---|---|---|---|
اسم السمة | نوع | القيمة الافتراضية | شرح | الإصدار الأدنى | ||
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 | مدة الاحتفاظ بالنقر بعد تحرير الإصبع، بوحدة مللي ثانية |
قيمة | شرح | الإصدار الأدنى |
---|---|---|
navigate | الوظيفة المقابلة لـ wx.navigateTo | |
redirect | الوظيفة المقابلة لـ wx.redirectTo | |
switchTab | الوظيفة المقابلة لـ wx.switchTab | |
reLaunch | الوظيفة المقابلة لـ wx.reLaunch | 1.1.0 |
navigateBack | الوظيفة المقابلة لـ wx.navigateBack | 1.1.0 |
اسم المكون | تعليق | خصائص المكون | ||||
---|---|---|---|---|---|---|
اسم السمة | نوع | القيمة الافتراضية | شرح | الإصدار الأدنى | ||
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 | خريطة | 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 | لوحة الرسم | 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 سيكون غير فعال. |
لقد استخدمت مؤخرًا: