@karen.wisozk
В React Native вы можете использовать условное отображение стилей для каждого второго элемента, чтобы убрать границу. Вот пример кода:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 |
import React from "react"; import { View, StyleSheet } from "react-native"; const styles = StyleSheet.create({ container: { flex: 1, flexDirection: "row", justifyContent: "space-between", }, item: { flex: 1, borderBottomWidth: 1, }, evenItem: { borderBottomWidth: 0, }, }); const App = () => { const data = ["Item 1", "Item 2", "Item 3", "Item 4", "Item 5"]; return ( {data.map((item, index) => ( {/* Ваше содержимое элемента */} ))} ); }; export default App; |
В этом примере создается контейнер с расположением элементов в строке и пространством между ними. Массив data
содержит данные, которые вы можете использовать для отображения элементов. Мы используем метод map
, чтобы пройтись по каждому элементу массива и отобразить его в виде View
. Мы также используем условное отображение стиля для каждого второго элемента с помощью оператора %
.
В данном случае, каждый четный элемент (с индексом, делится на 2 без остатка) будет иметь стиль evenItem
, где borderBottomWidth
равен 0, что уберет границу.
Вы можете изменить стили item
и evenItem
на свои собственные, чтобы соответствовать вашим требованиям.