Reactjs 如何在react datetime选择器中获取e.target.name？

我正在创建一个表单，可以获取时间选择器的时间值。 但是由于

e

已经是

时刻

，我无法在handleChange中获得输入的

名称

有办法得到它吗

组成部分：

        <DateTimeRangePicker
          selected={time}
          onChange={handleChange}
          type='timepicker'
          readOnly={false}
          texts={{
            name: 'time',
            placeholder: 'Enter your time out'
          }}
          timeFormat='HH:MM:SS'
        />

它必须是

e.target.name

，因为Submit上的CustomForm将通过其

e.target.name

---

用于来自的组件

日期时间范围选择器

从picker
onChange
接收到的不是从Jsx元素获得的典型的
事件
；而是选择器的时间
值

你可以通过这个在源代码中看到它

解决方案是将
handleChange
包装起来，并使用常量定义属性名称，如下所示

const TIME_NAME = "time";


const YourComponent = () => {

    const [values, setValues] = useState(initialState)
    const [data, setData] = useState(initialState)

    const handleChange = useCallback(
        (e: any) => {
          let result: any

          setValues({ ...values, [e.target.name]: e.target.value })
          if (e._isValid === true) {
            result = {
              value: e.target.value,
              status: true
            }
          } else {
            result = {
              value: e.target.value,
              status: false
            }
          }
          setData({ ...data, [e.target.name]: result })
        },
        [data]
      );

    const handleDateTimeRangePickerChange = (_value) => {
        handleChange({target: {name: TIME_NAME, value: _value }});
    }


    return <DateTimeRangePicker
        name={TIME_NAME}
        selected={time}
        onChange={handleDateTimeRangePickerChange}
        type='timepicker'
        readOnly={false}
        texts={{
          name: 'time',
          placeholder: 'Enter your time out'
        }}
        timeFormat='HH:MM:SS'
    />
}

const TIME\u NAME=“TIME”；
constyourcomponent=（）=>{
const[values，setValues]=useState（initialState）
const[data，setData]=useState（initialState）
const handleChange=useCallback(
（e：任何）=>{
结果：有吗
setValues（{…values，[e.target.name]：e.target.value}）
如果（e._isValid==真）{
结果={
价值：即目标价值，
状态：正确
}
}否则{
结果={
价值：即目标价值，
状态：false
}
}
setData（{…data[e.target.name]：result}）
},
[数据]
);
const handleDateTimeRangePickerChange=（\u值）=>{
handleChange（{target:{name:TIME\u name，value:\u value}}）；
}
返回
}
data:{“username”：“…}}截图代表什么？截图代表我为什么需要获取
e.target.name
。由于我需要获取表单中每个输入组件的数据，让我重新表述我的问题：您的屏幕截图描述了什么结果？它是handleChange内部的
console.log（e）
的结果，是来自
console.log（data）
还是来自
console.log（values）
？屏幕截图的结果来自
handleSubmit
onSubmit？（{data，finalStatus}）
，但我的问题并没有围绕这一点。请关注e.target.name
const TIME_NAME = "time";


const YourComponent = () => {

    const [values, setValues] = useState(initialState)
    const [data, setData] = useState(initialState)

    const handleChange = useCallback(
        (e: any) => {
          let result: any

          setValues({ ...values, [e.target.name]: e.target.value })
          if (e._isValid === true) {
            result = {
              value: e.target.value,
              status: true
            }
          } else {
            result = {
              value: e.target.value,
              status: false
            }
          }
          setData({ ...data, [e.target.name]: result })
        },
        [data]
      );

    const handleDateTimeRangePickerChange = (_value) => {
        handleChange({target: {name: TIME_NAME, value: _value }});
    }


    return <DateTimeRangePicker
        name={TIME_NAME}
        selected={time}
        onChange={handleDateTimeRangePickerChange}
        type='timepicker'
        readOnly={false}
        texts={{
          name: 'time',
          placeholder: 'Enter your time out'
        }}
        timeFormat='HH:MM:SS'
    />
}