[英]How can I get a selected value from DateTimePicker using 'react-datetime'
我想從我的 DateTimePicker 中獲得一個選定的值。 而不是看到我看到的值 [Object object]
這是我的 DateTimePicker。
import React from 'react';
import momentLocaliser from 'react-widgets-moment';
import DateTime from 'react-datetime';
import PropTypes from 'prop-types';
import classNames from 'classnames';
const moment = require('moment');
moment.locale('es');
momentLocaliser(moment);
const handleChange = (e) =>{
const valueOfInput = moment(e.target.value).format('DD-MM-YYYY HH:mm');
return valueOfInput;
}
const DateTimePickerInput = ({
label,
format,
input,
width,
placeholder,
selected,
tooltip,
tooltipPlacement,
disabled,
defaultValue,
inputProps,
meta: { valid, touched, error},
//input: { onChange, value, onBlur},
showTime,
...props
}) => {
const classes = classNames('form-group', {
'has-error': (touched && !valid),
'has-success': (touched && !valid)
})
return (
<div className={classes}>
<label htmlFor={input.name}>{label}</label> <br />
<DateTime
name = {input.name}
locale='es'
dateFormat= "DD-MM-YYYY"
timeFormat= "HH:mm"
onChange = {(changedVal) => handleChange(changedVal)}
inputProps={{disabled: true, placeholder: {handleChange}}} //In placeholder is the issue
/>
{(!valid && touched) &&
<p className='help-block'>{error}</p>
}
</div>
);
};
DateTimePickerInput.propTypes = {
disabled: PropTypes.bool,
input: PropTypes.object.isRequired,
label: PropTypes.string.isRequired,
meta: PropTypes.object.isRequired,
placeholder: PropTypes.string,
tooltip: PropTypes.string,
tooltipPlacement: PropTypes.string
}
export default DateTimePickerInput;
我希望從 dateTimePicker 獲得選定的值,但只能看到我看到 [Object object]。
我現在需要解決。
我相信如果我在聲明 DateTimePickerInput 並分配給占位符 onChange 時聲明 onChange 之類的參數,事情就會改變。 但我不確定。 我需要有人告訴我出了什么問題。
onChange :日期改變時的回調觸發。 如果輸入中的日期有效,則回調接收選定的矩對象作為唯一參數。 如果輸入中的日期無效,則回調接收輸入的值(字符串)。
因此,將moment(e.target.value)
更改為moment(e.toDate())
const handleChange = (e) =>{
const valueOfInput = moment(e.toDate()).format('DD-MM-YYYY HH:mm');
return valueOfInput;
}
inputProps={{ placeholder:moment().format('DD-MM-YYYY HH:mm'), disabled: true }}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.