react-native-calendars 跳转到选定月份

Question

我正在使用 react-native-calendars。我有一个 <Calendar/> 组件。

我已经阅读文档十几遍了，找不到比 current 属性更好的更改月份的属性，它初始化日历视图。例如，如果我设置 current={"2014-01-01"}，我将看到 2014 年的日历，即 1 月 1 日。问题是我无法重新渲染此道具。

我也尝试过使用 key 道具，但它不会更改日期。 Ref 也不是一个选项，我有自定义 <CalendarHeader/>

package.json

 "react": "17.0.2",
 "react-native": "0.66.4",
 "react-native-calendars": "1.1274.0"

Calendar.tsx

const CalendarScreen = () => {
  const [current, setCurrent] = useState('2020-01-01');

return (
        <Calendar
          current={current}
          customHeader={CalendarHeaderHandler}
          style={styles.calendar}
        />
        <TouchableOpacity onPress={() => setCurrent('2021-01-01')}>
            <Text>2021</Text>
        </TouchableOpacity>
 )};

Answer 1

通过添加道具 key 和 current

解决了这个问题

Prop key 触发重新渲染

  const CalendarScreen = () => {
      const [current, setCurrent] = useState('2020-01-01');

  return(
        <Calendar
          current={current}
          key={current}
          customHeader={CalendarHeaderHandler}
          style={styles.calendar}
        />
        <TouchableOpacity onPress={() => setCurrent('2021-01-01')}>
            <Text>2021</Text>
        </TouchableOpacity>
   )};

react-native-calendars 跳转到选定月份

react-native-calendars jump to a selected month

react-native

react-native-calendars