antd datepicker 如何在 const 中创建返回变量？

Question

嗨，我是新手前端开发人员......

问题在下面

1. 如何在 const onChange 中返回 a ？
2. 如果可能的话，有什么问题吗？

import React from 'react'
import { DatePicker } from 'antd';

var a = "";

const onChange = ( date, dateString ) => {
  console.log( dateString )
  return a = ( dateString )
};
export const monthval = () => {
  return a
};
const MonthPicker = () => {

  return (
    <>
        <DatePicker onChange={onChange} picker="month" 
                    
        />
    </>    
    )
}

export default MonthPicker

Answer 1

为了保存不断变化的值，我们使用状态。为了保存日期，我们需要创建一个状态。并在每次调用 onChange 函数时更改它。我们在组件内部创建状态

const [date, setDate] = useState();

并且在更改时您需要调用设置函数。

const onChange = ( date, dateString ) => {
   setDate(dateString)
};

建议检查各州及其所在位置。 https://www.w3schools.com/react/react_usestate.asp

Answer 2

从 'react' 导入 React, { useState };

从 'antd' 导入 { DatePicker };

const MonthPicker = () => {

const [selectedMonth, setSelectedMonth] = useState("");

const onChange = (日期, dateString) => {

console.log(dateString);

setSelectedMonth(dateString); // Update state instead of a global variable

};

返回（ <>

  <DatePicker onChange={onChange} picker="month" />


</>    

）；

};

// 如果需要，可以访问所选月份的辅助函数

导出 const getMonthValue = (selectedMonth) => selectedMonth;

导出默认MonthPicker；