Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

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

I am working on a React application and currently have a date picker to select a date range using Ant Design. I want to store the value of the selected date into a variable that can be accessed by another file in my program. How can I bind the selected value into a variable? Here is the JavaScript code for my date picker:

 <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>
about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

Check the following example, You can store the date values in a variable once the date is selected and onChange function is called.

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

Screenshot

screenshot

about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda