我正在尝试使用 Material-ui-pickers 的日期选择器,其中示例演示是使用State Hooks编写的。我想获取日期值作为父组件的回调。这是子组件:
import React, { Component } from 'react';
import { Fragment, useState } from "react";
import { DatePicker, InlineDatePicker } from "material-ui-pickers";
function YearMonthPicker(props) {
const [selectedDate, handleDateChange] = useState("2013-01-01");
return (
<div className="picker">
<DatePicker
openTo="year"
views={["year", "month"]}
label="Year and Month"
helperText="With min and max"
minDate={new Date("2011-01-01")}
maxDate={new Date("2018-12-01")}
value={selectedDate}
onChange={handleDateChange}
/>
</div>
);
}
export default YearMonthPicker;
Run Code Online (Sandbox Code Playgroud)
在“onChange”上,该函数修改其“selectedDate”状态。
在我的父组件中,我定义了该函数:
handleChangeTo = e => {
this.setState({ dateTo: e.target.value });
};
Run Code Online (Sandbox Code Playgroud)
并且,在渲染方法中,我尝试这样调用它:
<YearMonthPicker handleChangeTo={this.handleChangeTo} /> …Run Code Online (Sandbox Code Playgroud)