Javascript rc calendar当我在日历中选择日期时，它不会在文本框中更改

我不熟悉rc日历

我可以显示rc calendar，但当我在日历中选择日期时，它不会在文本框中更改

所以我调试并研究了他们文档中的各种方法。 但不确定使用哪种方法

你能告诉我怎么修吗？这样以后我就可以自己修了

我认为问题是由于这行输入value={moment（value）.format（'M/D/YY'）}/>

render（）{
常量日历=（）；
返回(
{
（{value}）=>{
返回(
// 
)
}
}
)
}

在这里，您的代码正在工作，只需通过“handleChange”方法设置状态，并通过“矩”方法传递参数：

import React, {Component} from 'react';
import Calendar from 'rc-calendar';
import DatePicker from 'rc-calendar/lib/Picker';
import 'rc-calendar/assets/index.css';
import moment from 'moment';

class CalendarPage extends Component {
  constructor(props) {
    super(props);
    this.state = {
      date: new Date(),
    };
    this.handleChange = this.handleChange.bind(this);
}

handleChange(date) {
  console.log(date);
  this.setState({
    date: date,
  });
}

render() {
    const calendar = (<Calendar/>);
    return (
        <div>
            <DatePicker
                animation="slide-up"
                value={moment(this.state.date)}
                disabled={false}
                calendar={calendar}
                onChange={this.handleChange}
            >{
                ({value}) => {
                    return (
                        <input value={moment(value).format('M/D/YY')}/>
                    )
                }
            }</DatePicker>
        </div>
    )
  }
}

export default CalendarPage;

import React，{Component}来自'React'；
从“rc日历”导入日历；
从“rc calendar/lib/Picker”导入日期选择器；
导入“rc calendar/assets/index.css”；
从“力矩”中导入力矩；
类CalendarPage扩展组件{
建造师（道具）{
超级（道具）；
此.state={
日期：新日期（），
};
this.handleChange=this.handleChange.bind（this）；
}
手册更改（日期）{
控制台日志（日期）；
这是我的国家({
日期:日期:，
});
}
render（）{
常量日历=（）；
返回(
{
（{value}）=>{
返回(
)
}
}
)
}
}
导出默认日历页面；

hey it worked您能告诉我您是如何修复的吗？如果您对代码给出注释，那就太好了。当您选择日期时，您应该通过handleChange方法将日期设置为state，并在'矩（this.state.date）'方法中在DatePicker组件中传递状态日期。如果您对我的答案满意，请接受它

import React, {Component} from 'react';
import Calendar from 'rc-calendar';
import DatePicker from 'rc-calendar/lib/Picker';
import 'rc-calendar/assets/index.css';
import moment from 'moment';

class CalendarPage extends Component {
  constructor(props) {
    super(props);
    this.state = {
      date: new Date(),
    };
    this.handleChange = this.handleChange.bind(this);
}

handleChange(date) {
  console.log(date);
  this.setState({
    date: date,
  });
}

render() {
    const calendar = (<Calendar/>);
    return (
        <div>
            <DatePicker
                animation="slide-up"
                value={moment(this.state.date)}
                disabled={false}
                calendar={calendar}
                onChange={this.handleChange}
            >{
                ({value}) => {
                    return (
                        <input value={moment(value).format('M/D/YY')}/>
                    )
                }
            }</DatePicker>
        </div>
    )
  }
}

export default CalendarPage;