React-native-calendars: No possible way to go back directly to the current date

Created on 3 May 2019  路  4Comments  路  Source: wix/react-native-calendars

Description

If we navigate from current month, either forward or backward, there is no possible option to go back directly to the current date. Needs to navigate back to reach the current month/date.

Expected Behavior

Should have a usability option to get back to the current date.

Observed Behavior

No usability option to go directly back to the current date.

Environment

Please run these commands in the project folder and fill in their results:

  • npm ls react-native-calendars: 1.82.0
  • npm ls react-native: 0.59.5

Reproducible Demo

   const vacation = {key:'vacation', color: 'red', selectedDotColor: 'blue'};
   const massage = {key:'massage', color: 'blue', selectedDotColor: 'blue'};
   const workout = {key:'workout', color: 'green'};

  <Calendar
    markedDates={{
      '2019-05-25': {dots: [vacation, massage, workout], selected: true, selectedColor: 'red'},
      '2019-05-16': {dots: [massage, workout]},
    }}
    markingType={'multi-dot'}
    onDayPress={(day) => this.datePressed(day)}
  />
stale

Most helpful comment

Honestly was just thinking of how to work this out

All 4 comments

Honestly was just thinking of how to work this out

use the current prop.
Like this:
<Calendar current={this.state.current} ...calendarProps />

and create a button wherever you want. On button press, do this:
this.setState({current: this.state.current' {/*...you may just enter your current date here...*/'})
this will re-render the calendar and set it to current date

If anyone still has this problem, may try this one

function calendar(){
    const [current, setCurrent] = useState(new Date().toISOString())
    return (
        <View>
            <Button title={'today'} onPress={()=>setCurrent(new Date().toISOString())} />
            <CalendarList current={current}/>
        </View>
    )
}

Be sure to use new Date().toISOString() which can give you a new string but new Date().toISODate() won't.

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

microwin168 picture microwin168  路  4Comments

Yandamuri picture Yandamuri  路  4Comments

dobiedad picture dobiedad  路  4Comments

joaosauer picture joaosauer  路  4Comments

MrAlekhin picture MrAlekhin  路  4Comments