1

在反应本机日历中，有提供计划事件的标记日期。手动输入的代码如下：
markedDates={{
'2012-05-16': {selected: true, mapped: true, selectedColor: 'blue'},
'2012-05-17': {marked: true} ,
'2012-05-18': {marked: true, dotColor: 'red', activeOpacity: 0},
'2012-05-19': {disabled: true, disableTouchEvent: true}
}}
我该怎么办从数组中动态设置markedDates？

这是来自 render() 的行：
markedDates={this.state.selectedDate, this.state.markedDates}

这在 componentDidMount 中执行：
var selectedDate = {}
selectedDate[dateString] = { selected: true, selectedColor: '#c4c4c4', text: { color: 'black' } }
this.setState({ selectedDate: selectedDate })

在 react-native-calendars 中动态标记日期 这是一个类似问题的链接，但它并没有真正回答它，或者我不明白答案。两者皆有可能

4

1 回答 1

0

有一个看起来像的数组

['yyyy-mm-dd','yyyy-mm-dd','yyyy-mm-dd']

你可以像这样映射它：

var customMarkedDates = {};
var arrayOfDates =  ['2020-11-06','2020-11-25','2020-08-12'];
arrayOfDates.map((day) => {
          customMarkedDates[day] = {
            customStyles: {
              container: {
                backgroundColor: "red",
              },
              text: {
                color: "white",
                fontWeight: "bold",
              },
            },
          };
        });

this.setState({customMarkedDates: customMarkedDates})

然后你可以在你的日历中调用它，markedDates={this.state.customMarkedDates}并在需要时更改它。

于 2020-11-20T16:06:10.730 回答