Picker في React Native
يُصيّر مكون الانتقاء الأصيل على iOS و Android. مثال:
<Picker
selectedValue={this.state.language}
style={{height: 50, width: 100}}
onValueChange={(itemValue, itemIndex) =>
this.setState({language: itemValue})
}>
<Picker.Item label="Java" value="java" />
<Picker.Item label="JavaScript" value="js" />
</Picker>
الخاصيات
يرث خاصيّات المكوّن View.
onValueChange
دالة رد نداء تُستدعى بالمعاملات التالية عند تحديد عنصر ما:
- itemValue: الخاصية value الخاصة بالعنصر المُحدَّد.
- itemPosition: فهرس العنصر المُحدَّد في مكوّن الانتقاء هذا.
| النوع | مطلوب |
|---|---|
| دالة | لا |
selectedValue
قيمة مطابقة لقيمة أحد العناصر. يمكن أن تكون سلسلة نصيّةً أو عددًا صحيحًا.
| النوع | مطلوب |
|---|---|
| أي نوع | لا |
style
| النوع | مطلوب |
|---|---|
| pickerStyleType | لا |
testID
يُستخدَم لتحديد موقع العرض هذا في الاختبارات الشاملة (end-to-end tests).
| النوع | مطلوب |
|---|---|
| سلسلة نصية | لا |
enabled
إذا كانت قيمتُها القيمةَ false، فسيُعطَّل الانتقاء، أي أنّ المستخدم لن يستطيع التحديد.
| النوع | مطلوب | المنصة |
|---|---|---|
| قيمة منطقيّة | لا | Android |
mode
على Android، تُحدِّد كيفيّة عرض عناصر التحديد عند نقر المستخدم على المنتقي:
-
'dialog': إظهار مربّع حوار (modal dialog). هذه هي القيمة الافتراضيّة. -
'dropdown': عرض قائمة منسدلة مرتبطة بعرض المنتقي.
| النوع | مطلوب | المنصة |
|---|---|---|
enum('dialog', 'dropdown')
|
لا | Android |
prompt
سلسلة نصيّة تُمثِّل مَحثَّ (prompt) المنتقي، تُستخدَم على Android في وضع الحوار (dialog mode) كعنوان لمربّع الحوار.
| النوع | مطلوب | المنصة |
|---|---|---|
| سلسلة نصية | لا | Android |
itemStyle
نمط لتطبيقه على كل تسميّة (label) من تسميات العناصر.
| النوع | مطلوب | المنصة |
|---|---|---|
| أنماط النص (text styles) | لا | iOS |