How to separate date and time in react native code?-CodePudding

I'm having issue on how to separate date and time in react native. Currently the format of the date and time is like this in API . I don't know how to implement it in my react native code separating the date and time. Below i have attach the code. Pls do help me out.

const renderItem = ({item}) => (
                <View style={[GlobalStyle.AlignEventContainer]}>
                <TouchableOpacity style={[GlobalStyle.EventListContainer]} activeOpacity={0.8} onPress={() => {navigation.navigate('EventDetailScreen', {transferedData: item});}}>
                <Image style={[GlobalStyle.EventListImage]} source={{uri:item.main_image}}/>
                <View style={[GlobalStyle.EventListTitleContainer]}>
                    <Text style={[GlobalStyle.EventListTitle]}>{item.name}</Text>
                </View>
                <View style={[GlobalStyle.EventListBottomContainer]}>
                    <View style={[GlobalStyle.EventListLeftContainer]}>
                        <Text style={[GlobalStyle.EventListVenue]}>{item.venue}</Text>
                        <Text style={[GlobalStyle.EventDate]}>{item.starts_on}</Text>
                        <Text style={[GlobalStyle.EventTime]}>{item.starts_on}</Text>
                    </View>
                    <View style={[GlobalStyle.EventListRightContainer]}>
                        <Text style={[GlobalStyle.EventListFee]}>{item.price}</Text>
                    </View>
                </View>
            </TouchableOpacity>
            </View>
          )

CodePudding user response：

There are two approach for doing it, first way (that is easier) using packages like moment or dayjs by using it you are be able to handle date and convert to many different shapes (for more information check the documents of them). For example if you want to separate date and time from a timestamp you can do it by moment like below:

/*
  other your imports and codes
*/
let timestamp = moment(item.starts_on);
let date = timestamp.format('L');
let time = timestamp.format('LT');
/*
  other your codes
*/

Second way is using at instance of Date, for doing it you can:

/*
  other your imports and codes
*/
let d = new Date(item.starts_on);
let date = `${d.getMonth()   1}/${d.getDate()}/${d.getFullYear()}`;
let time = `${d.getHours()}:${d.getMinutes()}`;
/*
  other your codes
*/