React Native vs Flutter - React Native's rendering

Landing.js

render() {
  const {showings,films,selected_date,selected_film,showFilmDetails}= {...this.state}; // <-- 9
  return (
    <SafeAreaView> // <-- 10
      <ScrollView>  // <-- 11
        <View>                          // <-- 12
          <View style={styles.header}>  // <-- 12
            <Image source={require(`./assets/daam.png`)} style={styles.logo} />  // <-- 13, 14
            <Title>Dinner And A Movie</Title>
          </View>
          <Text>Tap a movie below to see its details. Then pick a date  // <-- 15
                to see showtimes.</Text>
          <DatePicker />                       // <-- 16
          {showings && selected_film.id &&     // <-- 17
            <ShowingTimes showings={showings} selected_date={selected_date} 
                          chooseTime={this.chooseTime} film={selected_film} />}
          {films.map(film => <FilmBrief film={film} key={film.id}            // <-- 18
            isSelected={film.id === selected_film.id} />)}
        </View>
        <Modal visible={showFilmDetails}>                                         // <-- 19
          <ScrollView>                                                            // <-- 19
            <FilmDetails film={selected_film} selected_date={selected_date}       // <-- 19
                              showings={showings} chooseTime={this.chooseTime} /> // <-- 19
            <Button title="Done"                                                  // <-- 19
              onPress={() => store.dispatch({ type: "HIDE_FILM_DETAILS" })} />    // <-- 19
          </ScrollView>                                                           // <-- 19
        </Modal>                                                                  // <-- 19
      </ScrollView>
    </SafeAreaView>
    )
  }