react如何获取当前日期
获取当前日期的几种方法
在React中获取当前日期可以通过JavaScript的Date对象实现，以下是几种常见的方式：
方法1：直接使用new Date()
const currentDate = new Date();
console.log(currentDate); // 输出完整日期时间对象方法2：格式化日期字符串
const currentDate = new Date().toLocaleDateString();
console.log(currentDate); // 输出本地化日期字符串（如"2023/5/15"）方法3：获取年月日单独值
const date = new Date();
const year = date.getFullYear();
const month = date.getMonth() + 1; // 月份从0开始需+1
const day = date.getDate();
console.log(`${year}-${month}-${day}`); // 输出"2023-5-15"在React组件中使用
类组件示例：
import React from 'react';
class DateDisplay extends React.Component {
render() {
const today = new Date().toLocaleDateString();
return <div>当前日期: {today}</div>;
}
}函数组件示例：
import React from 'react';
function DateDisplay() {
const today = new Date().toISOString().slice(0, 10); // YYYY-MM-DD格式
return <div>当前日期: {today}</div>;
}使用第三方库（如date-fns）
如需更复杂的日期操作，可以安装日期处理库：
npm install date-fns使用示例：
import { format } from 'date-fns';
function App() {
return <div>{format(new Date(), 'yyyy-MM-dd')}</div>;
}注意事项
- 浏览器时区会影响
toLocaleDateString()的输出结果 - 服务端渲染(SSR)时需确保日期处理与客户端一致
- 对于频繁更新的日期显示，建议使用
useEffect和状态管理
