如何在反应本机日历中设置多个选定的日期颜色？

Question

我react-native-calendars在我的项目中使用。我正在尝试选择多个日期并尝试更改其颜色。当我安慰所选日期时，我正在获取所选日期。但我无法改变它的颜色。任何帮助都是非常可观的，谢谢。以下是我的代码日历.js  selectDate(day) {        let selectedDate = day.dateString;        if (this.state.dates[selectedDate]) {          const newDates = this.state.dates;          delete newDates[selectedDate]          this.setState({ dates: newDates });        } else {          const newDates = this.state.dates;          newDates[selectedDate] = [            { selected: true, startingDay: true, color: '#05A081' },            { selected: true, endingDay: true, color: '#05A081' },          ]          this.setState({ dates: newDates });          console.log("NEW_ARRAY", this.state.dates);        }      }   ....    <CalendarList              minDate={Date.now()}              pastScrollRange={24}              futureScrollRange={24}              markingType={'period'}              onDayPress={(day) => this.selectDate(day)}              markedDates={this.state.dates}            />以下是控制台结果NEW_ARRAY {2019-09-03: Array(2), 2019-09-04: Array(2), 2019-09-05: Array(2)}2019-09-03: Array(2)0: {selected: true, startingDay: true, color: "#05A081"}1: {selected: true, endingDay: true, color: "#05A081"}length: 22019-09-04: (2) [{…}, {…}]2019-09-05: (2) [{…}, {…}]

Answer 1

你可以像这样改变颜色。另外，请查看文档。

selectDate(day) {

        let selectedDate = day.dateString;

        if (this.state.dates[selectedDate]) {

          const newDates = this.state.dates;

          delete newDates[selectedDate]

          this.setState({ dates: newDates });

        } else {

          const newDates = this.state.dates;

          newDates[selectedDate] = [

            { selected: true, startingDay: true, color: 'yourColorHere' }, //change color here

            { selected: true, endingDay: true, color: 'yourColorHere' },//change color here

          ]

          this.setState({ dates: newDates });

          console.log("NEW_ARRAY", this.state.dates);

        }

      }

   ....

    <CalendarList

              minDate={Date.now()}

              pastScrollRange={24}

              futureScrollRange={24}

              markingType={'period'}

              onDayPress={(day) => this.selectDate(day)}

              markedDates={this.state.dates}

            />

Answer 2

 const selectDate=(day)=> {

    let selectedDate = day.dateString;

    let newDates = dates;

    if (dates[selectedDate]) {

      delete newDates[selectedDate]

    } else {

      

      newDates[selectedDate]={selected: true, marked: true, selectedColor: Colors.YELLOW};

      

      

    }

    setdates({...newDates})

  }