Platform-specific bileşen

Platform'a özel bileşen yazmayı öğrenirsin.

Platform-specific bileşen

Platform.select yalnızca sayı ve dize değil, bileşen de seçebilir. iOS'ta başka bir bileşen, Android'de başka bir bileşen göstermek istediğinde bu yöntemi kullanırsın. Her anahtara bir bileşen atarsın; Platform.select geçerli platformunkunu döndürür.

const Button = Platform.select({
  ios: IOSButton,
  android: AndroidButton,
  default: DefaultButton,
});

Burada Button değişkeni, hangi platformda olursan ol ilgili bileşeni tutar. Bileşeni <Button /> olarak kullanabilirsin; React Native doğru olanı render eder.

Uygulama Sıra sende: platforma göre bileşen seç

Platform'u içe aktar. Card değişkenini Platform.select({ ios: IOSCard, android: AndroidCard, default: DefaultCard }) sonucuna eşitle.

Örnek çözümü göster

import { Platform } from 'react-native';

const Card = Platform.select({
  ios: IOSCard,
  android: AndroidCard,
  default: DefaultCard,
});

Varsayılan değer

Platform.select nesnesinde default anahtarı, ne ios ne android anahtarı varsa kullanılır. Bu, uygulaman gelecekte yeni bir platforma (örneğin web) genişletilirse güvenlik ağı sağlar.

Genellikle default değerini, çoğunuk olarak kullandığın platformun bileşenine ayarlarsın. Örneğin hem iOS hem Android değerleri varsa ve default yoksa, web ortamında undefined döner ve bu hataya yol açar. default eklemek bu riski ortadan kaldırır.

Kendini test et

Boşluğu doldur: bileşen seç

const Button = Platform.____({ ios: IOSButton, android: AndroidButton });

Cevabı göster

const Button = Platform.select({ ios: IOSButton, android: AndroidButton });

Platform.select ile bileşen seçmek nasıl çalışır?
```
Platform.select({ ios: A, android: B })
```
- Geçerli platformun bileşenini döndürür
- İki bileşeni de birleştirir
- Yalnızca ios bileşenini döndürür
- Hata verir
Cevabı göster

Geçerli platformun bileşenini döndürür — Platform.select geçerli platformun bileşenini döndürür.
Eşleştir: anahtar ve kullanım

ios

iOS bileşeni
android

Android bileşeni
default

yedek bileşen

Sıradaki ders: Özet - Platform

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler