react-native - 使用 react-native 日历条仅显示 3 个日期

Question

如何使用 react-native 日历条仅显示当前日期 +1 和 -1 天。

Ex- 19 20 21 而不是其他日期

我正在使用 react-native-calendar-strip

        <CalendarStrip
          calendarAnimation={{type: 'sequence', duration: 30}}
          daySelectionAnimation={{
            type: 'background',
            duration: 300,
            highlightColor: '#ccc',
          }}
          style={{
            height: ResponsiveHeight(100),
            paddingTop: ResponsiveHeight(20),
            paddingBottom: ResponsiveHeight(10),
          }}
          calendarHeaderStyle={{color: 'black'}}
          calendarColor={'#FFED49'}
          dateNumberStyle={{color: 'black'}}
          dateNameStyle={{color: 'black'}}
          calendarHeaderContainerStyle={{marginTop: ResponsiveHeight(-20)}}
          datesWhitelist={datesWhitelist}
        />

Answer 1

尝试使用minDate和maxDate属性。

render() {
    let datesWhitelist = [{
      start: moment().subtract(1, 'days'), // yesterday
      end: moment().add(1, 'days')  // tomorrow
    }];
    return (
      <View style={{ flex: 1 }}>
        <CalendarStrip
          style={{ height: 150, paddingTop: 20, paddingBottom: 10 }}
          minDate={moment().subtract(1, 'days')}
          maxDate={moment().add(1, 'days')}
          disabledDateNameStyle={{ color: 'white' }}
          disabledDateNumberStyle={{ color: 'white' }}
          datesWhitelist={datesWhitelist}
      />
      </View>

    );
  }

上面给出了示例代码。