主页 / 问题 / 1024913
Accepted
cheerful_weasel
Asked:2020-09-16 18:55:50 +0000 UTC2020-09-16 18:55:50 +0000 UTC

如何在 react-dates 日历中定义月份切换？

  • 772

我在我的网络应用程序中使用 react-dates 作为日历。我需要跟踪几个月之间的转换。那些。我需要知道用户何时将日历切换到某个月份。

这是我的日历。

<DayPickerSingleDateController
   numberOfMonths={1}
   date={this.state.dateForCalendar}
   isDayHighlighted={this.highlited}
   renderCalendarDay={this.renderDay}
   onDateChange={this.daySelected}
   firstDayOfWeek={0}
/>

我在文档中找到了 onPrevMonthClick 和 onNextMonthClick 属性，它们将函数作为输入。我以为这正是我所需要的，但是在插入这些属性时，编译器会抛出错误

./src/features/schedule/index.js
  Line 178:  Parsing error: Unexpected token

  176 |                         {this.state.calendar_on &&
  177 |                         <DayPickerSingleDateController
> 178 |                             onPrevMonthClick: {text => {console.log(text)}}
      |                                               ^
  179 |                             numberOfMonths={1}
  180 |                             date={this.state.dateForCalendar}
  181 |                             isDayHighlighted={this.highlited}

我究竟做错了什么？（即使我传递一个不带参数或返回布尔值的函数）

reactjs

1 个回答

  1. Best Answer

    要将数据从父级传输到子级，props必须通过等号=而不是冒号来指定传输的数据:。实际上，props这是一个不可变的只读对象props——它只是一个我们可以在内部使用的函数参数，但不能更改（更改它会导致问题）。在您的情况下，对代码进行少量编辑就足够了（用:等号替换冒号=）：

    <DayPickerSingleDateController
   onPrevMonthClick={text=>{console.log(text)}}
   onNextMonthClick={text=>{console.log(text)}}
   numberOfMonths={1}
   date={this.state.dateForCalendar}
   isDayHighlighted={this.highlited}
   renderCalendarDay={this.renderDay}
   onDateChange={this.daySelected}
   firstDayOfWeek={0}
/>

    但是，不建议在渲染中使用箭头函数。因为在渲染中使用箭头函数时，每次渲染组件时，都会创建一个新函数，可以打破优化并添加刹车。他们在 React 的文档中写到了这一点：渲染中的箭头函数

    • 0

相关问题