有没有办法将日历日期选择器中的选定日期绑定到另一个文件可以访问的变量？

Question

我正在开发一个 React 应用程序，目前有一个日期选择器 select 使用 Ant Design 的日期范围。我想将 selected 日期的值存储到一个变量中，该变量可以被我程序中的另一个文件访问。如何将 selected 值绑定到变量中？这是我的日期选择器的 JavaScript 代码：

 <p>Select a date range: </p>
              </div>
              <div className="left">
              <Space direction="vertical" size={12}>
                <RangePicker
                  format="YYYY-MM-DD"
                  onChange={this.onChange}
                  onOk={onOk}
                />
              </Space>

Answer 1

查看以下示例，您可以在选择日期并调用 onChange 函数后将日期值存储在变量中。

import React, { useState } from 'react';
import ReactDOM from 'react-dom';
import { DatePicker, Space } from 'antd';
import 'antd/dist/antd.css';
import './index.css';

const { RangePicker } = DatePicker;

const Demo = () => {
  let selecteddate;
  let selectedstartdate;
  let selectedenddate;

  const onChange = (value) => {
    selecteddate = value;
    selectedstartdate = value[0];
    selectedenddate = value[1];

    //Pass the following values
     console.log("selecteddate:",selecteddate);
     console.log("selectedstartdate:",selectedstartdate);
     console.log("selectedenddate:",selectedenddate);
  };

  return (
    <>
      <p>Select a date range: </p>
      <Space direction="vertical" size={12}>
        <RangePicker format="YYYY-MM-DD" onChange={onChange} />
      </Space>
    </>
  );
};

export default Demo

截图

有没有办法将日历日期选择器中的选定日期绑定到另一个文件可以访问的变量？

Is there a way to bind the selected date in a calendar date picker to a variable that can be accessed by another file?

javascript

reactjs

antd