React-native-calendars：如何避免初始日期在所有月份中被标记

问题根源 #

你碰到的情况是因为markedDates里的日期格式不对——要是只写了'28'这种单独的日，或者'10-28'这种月日组合，日历会默认匹配所有月份里的同一天，自然就每个月的对应日期都被标记了。

解决步骤 #

核心就是给markedDates里的每个标记日期都用完整的ISO格式字符串（YYYY-MM-DD），比如'2022-10-28'，明确指定年、月、日，这样就只会标记你要的那一天。

正确的marked对象示例 #

// 只标记2022年10月28日
const marked = {
  '2022-10-28': {
    marked: true,
    dotColor: '#22F460' // 也可以在这里单独设置标记点颜色，覆盖theme里的配置
  }
};

动态生成日期时的注意事项 #

如果你的marked是从接口或者其他地方动态生成的，一定要保留完整的年月日字符串，别只提取日部分。比如接口返回的日期是'2022-10-28'，直接用这个字符串当键就行，别处理成'28'。

修改后的组件代码 #

把格式正确的marked传入组件后，就不会出现跨月重复标记的问题了：

<Agenda
  items={items}
  loadItemsForMonth={loadItems}
  current={'2022-10-28'}
  showClosingKnob={true}
  renderItem={renderItem}
  theme={{
    dotColor: "#22F460", 
  }}
  markingType={'custom'}
  markedDates={marked}
/>

多日期标记的正确写法 #

要是需要标记多个日期，每个日期都得用完整格式当键：

const marked = {
  '2022-10-28': { marked: true },
  '2022-11-05': { marked: true },
  '2022-12-12': { marked: true }
};

内容的提问来源于stack exchange，提问作者Aziz Thioune