React Native Picker可以在某些項目之間使用某種分隔符或分隔符嗎？

Question

在其他React Native和Native Base組件中，我已經看到在主要可選條目中可以添加通常稱爲分隔符或分隔符的不可選項。

但是我看不到Picker組件中的那種東西。

我正在實施類似收藏夾或最近的項目排序在選擇器的頂部。能夠在最喜歡/最近的部分和主部分之間插入一種可見的分界線將是很好的。

+-----------+ 
| Ford  | 
| Chevrolet | 
+-----------+ 
| Toyota | 
| Nissan | 
| ...  | 

如果我可以在每個部分之前添加帶有文本的標題，那將會更好。

+-----------+ 
|==Recent===| 
+-----------+ 
| Ford  | 
| Chevrolet | 
+-----------+ 
|=The rest==| 
+-----------+ 
| Toyota | 
| Nissan | 
| ...  | 

Picker組件是否提供此功能，或者它是否可以輕鬆添加？

Answer 1

來自RN的Picker組件不提供這種開箱即用的功能。如果您想使用可定製的Picker，則最好使用https://github.com/sohobloo/react-native-modal-dropdown。有一個叫做renderSeparator的API道具，我認爲你可以很容易地使用它來達到你的目的。

Answer 2

不確定在選取器項目列表中創建部分。你可以做的是在選定的行上添加行。

IOS

您可以Picker組件上添加itemStyle道具。 因此，您可以在選定元素上添加邊框。

這裏是我做了什麼

<Picker 
    selectedValue={filter} 
    onValueChange={this._onFilterSelect} 
    style={sharedStyles.floatingPicker} 
    itemStyle={{ borderTopWidth: 1, borderTopColor: '#000', borderBottomWidth: 1, borderBottomColor: '#000' }} 
> 

的Android

你可以找到Android的here解決方案，但我從來沒有測試過。該解決方案將爲應用中的所有選取器添加樣式。如果這是你想要的，那很酷。

-

關於標題，我不知道這種構建的元素existe。 作爲一個Picker.Item存在，它將很高興有一個Picker.Header什麼的，但我從來沒有在文檔或互聯網上找到這樣的東西。 如果我找到可以幫助的事情，我會把它放在這裏。

希望這會有所幫助