React Native: Z Index zur Auswahl

Question

Es gab eine Menge Beiträge in Bezug auf Z-Index und Layer-Reihenfolge, aber keine mit viel einer Lösung. Es ist einfach genug, um Dinge nach Bedarf zu schichten, aber wenn Sie eine dynamische Layer-Neuordnung benötigen, wird dies zu einem Problem. Wie zum Beispiel habe ich vier bewegliche Elemente, wenn eines gewählt wird, sollte es sich über die anderen bewegen, aber sie sind bereits in der eingestellten Reihenfolge, so dass sich jedes unter dem anderen bewegt.

Wenn sie in Renderreihenfolge geschichtet sind, wie kann der aktive Gegenstand nach vorne verschoben werden und sich über die anderen drei bewegen?

Answer 1

Sie können dies lösen, indem Sie die Renderreihenfolge Ihrer Komponenten ändern. Lassen Sie uns sagen Sie einige Artikel, die Sie in einem Array und einem Index des ausgewählten Elements machen möchten, so Methode, um Ihre machen könnte wie folgt aussehen:

render() { 
    const items = ....; 
    const selectedIndex = ...; 
    return (
    <View> 
     {items.filter((item, index) => index != selectedIndex)} 
     {items[selectedIndex]} 
    </View> 
); 
} 

Auf diese Weise Ihre ausgewählte Element immer zuletzt machen würde und sein über von den anderen.