= react 使用antd中的时间组件
1.首先导入
import { DatePicker } from 'antd';
const { RangePicker } = DatePicker;
2.在render下面的return中放入
<RangePicker showTime={{format:'HH:mm'}}
format="YYYY-MM-DD "
onChange={onChange}onOk={onOk}/>
<Button onClick={this.Timer}></Button>
然后使用onChange时间转换日期格式(此格式是年-月-日的个格式),如果你想要年-月-日加时和分的话,需要format="YYY-MM-DDHH:mm".
function onChange(value,dateString) {
console.log('Selected Time: ', value);
console.log('Formatted Selected Time: ', dateString);
this.setState({
task_time: dateString//task_time指的是你选中的日期参数,需要存在this.state中
})
}
2.然后接收后台传过来的日期参数
Timer = () => {
console.log(sessionStorage.getItem('user'))
console.log(this.state.task_time[0])
fetch(`api/personal-center/conditionalQuery`, {
// 请求的方式
method: "POST",
// 请求头
headers: {
'Content-Type': 'application/json'
},
// 要传的参数
body: JSON.stringify({
start_date: this.state.task_time[0],
end_date: this.state.task_time[1],
current_Size: 5,
current_Page: 1,
user_id: 2,
})
}).then((res) => {
console.log(res)
return res.json()
}).then((res) => {
this.setState({
listArr: res.data,
total: res.total
})
}).catch(function (err) {
console.log(err)
})
}