z-index Problem in reagieren-native

Question

Wie absolut positionierten Elemente/Komponenten auf anderen Komponenten zu bringen, die danach wiedergegeben werden. Ich verwende scrollview Komponente

style: 
     width: 300, 
     height: 100, 
     position:'absolute', 
     top:30, 

aber auch andere Komponenten überlappen die Scroll-Dropdown-Menü. Ich wechselte von oben nach unten, aber die Komponenten, die auf der Oberseite der scrollview waren nicht überlappt zu werden.

Da ich neu zu diesem reagieren bin native und keine Ahnung von reactjs Ich bin nicht in der Lage, Lösung und Begriffe zu meinem Problem auszudrücken bitte helfen. habe ich angebracht Screenshot von meinem Problem in dem Bild unten ich eine Gesellschaft Drop-Down in scrollview Komponente und ist noch eine andere Scroll die sichtbar ist und überlappt die erste Komponente

Answer 1

EDIT: Gebürtiger Reagieren jetzt Unterstützung tut die z-index Eigenschaft! https://facebook.github.io/react-native/docs/layout-props.html

== alte Antwort ==

Reagieren Mutter keinen z-index Eigenschaft. Die z-Indizes werden durch die Reihenfolge Ihrer Komponenten bestimmt. Zum Beispiel:

<View> 
    <Image /> 
    <Text /> 
</View> 

Die <Text> werden immer über den <Image> sein.

Answer 2

zIndex Die Eigenschaft wird ab der reaktiven Version 0.29.0 für iOS unterstützt.

Answer 3

Ich hatte ein ähnliches Problem und es kam aus der Tatsache, dass der zIndex nicht auf die rechte Seite Komponente angewandt wurde. Zum Beispiel wenn Sie haben die folgende:

class App extends Component { 
    render() { 
     return (
      <View style={styles.form}> 
       <View style={styles.selectInput}> 
        <TextInput placeholder="Select something" /> 
        <Dropdown /> 
       </View> 
       <View style={styles.formInput}> 
        <TextInput placeholder="Stuff" /> 
       </View> 
       <View style={styles.formInput}> 
        <TextInput placeholder="Other stuff" /> 
       </View> 
      </View> 
     ); 
    } 
} 

Und Sie wollen Ihre Dropdown Komponente über den 2 Formulareingaben unten zu gehen, müssen Sie zIndex: 100 an seinen Container, die Ansicht mit selectInput Stil.