React Native - CSS :last-child without a border?

Question

In React Native, I have a static array of books that I map over and output in stacked rows like this:

return books.map((book, i) => {
  return(
    

        

Answer 1

You can try extended-stylesheet that supports :last-child:

import EStyleSheet from 'react-native-extended-stylesheet';

const styles = EStyleSheet.create({
  book: {
    borderBottomWidth: 1,
    borderBottomColor: '#000000'
  },
  'book:last-child': {
    borderBottomWidth: 0
  }
});

return books.map((book, i) => {
  const style = EStyleSheet.child(styles, 'book', i, book.length);
  return(
    
      {book.title}
    
  );
});