Calendar showing only month and year in React

Asked

Viewed 565 times

2

I’m developing an app with React Turn on and I wanted the calendar to show only the month and the year. I’m trying with the dependency React-Native-calendars but was unsuccessful.

import React, { Component } from 'react'
import { View, StyleSheet } from 'react-native'
import { Calendar } from 'react-native-calendars'

class ReleasesScreen extends Component {
    render() {
        return (
            <View style={styles.container}>
                <Calendar
                    hideExtraDays={true}
                    hideDayNames={true}
                    theme={{
                        calendarBackground: '#2195F2',
                        arrowColor: '#fff',
                        monthTextColor: '#fff'
                    }}
                />
            </View>
        )
    }
}

My app looks exactly like this: https://i.stack.Imgur.com/Qhfk0.png

and wanted to leave that way without the days Component: https://i.stack.Imgur.com/Ohsdv.png

If anyone can give me a solution or other dependency I do it. Thank you!

javascript react react-native calendar

  • would also like to know

  • Looking at the documentation, I didn’t see that the component has the option to use only months. Better you look for a component that gives you the option

  • Have you tried this Library? I think you’d better try other libraries https://github.com/react-native-community/datetimepicker

1 answer

-1

You can do an array with the months and show in a flatlist, example : const meses = ["January","February"...] To show the year, just use the new Date() and Moment, the new Date gives you hours, months and year, see more about it, and use Moment to format the year and show how you want and do two functions, one to increase the year and one to decrease the year. example :

Year : 2020 Months : January, February.... next year : Year + 1; back year : Year - 1;

Browser other questions tagged javascript react react-native calendar

You are not signed in. Login or sign up in order to post.