我如何使用 moment.js 获取和应用今天的价值？（react.js）

Question

目前，我正在使用 Moment.js 在 React.js 中制作日历

我还尝试添加一些我可以来回切换的按钮

 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/0.14.7/react-dom.min.js"></script> import './App.css'; import React,{useState} from 'react'; import moment from 'moment'; function App() { const [getMoment,setMoment] = useState(moment()); const today = getMoment; const firstWeek = today.clone().startOf('month').week(); const lastWeek = today.clone().endOf('month').week() === 1 ? 53 : today.clone().endOf('month').week(); const calendarArr=()=>{ let result=[]; let week=firstWeek; for(week; week <=lastWeek; week++){ result =result.concat( <tr key={week}> { Array(7).fill(0).map((data, index) => { let days = today.clone().startOf('year').week(week).startOf('week').add(index, 'day'); if(moment().format('YYYYMMDD') === days.format('YYYYMMDD')){ return( <td key={index} className="today" > <span>{days.format('D')}</span> </td> ); }else if(days.format('MM') !== today.format('MM')){ return( <td key={index} className="other" > <span>{days.format('D')}</span> </td> ); }else{ return( <td key={index} > <span>{days.format('D')}</span> </td> ); } }) } </tr>); } return result; } return( <> <div className="calendar-layout"> <div className="calendar"> <div className="control nav"> <span>{today.format('YYYY MM ')}</span> <button onClick={()=>{setMoment(getMoment.clone().subtract(1, 'month'))}}> previous month</button> <button onClick={()=>{setMoment(getMoment.toDate())}}>this month</button> <button onClick={()=>{setMoment(getMoment.clone().add(1, 'month'))}} >next month</button> </div> <table> <tbody> {calendarArr()} </tbody> </table> </div> </div> </> ) } export default App;

个月。

上个月和下个月的按钮没问题，但是这个月的按钮以某种方式不起作用并返回此错误：TypeError：today.clone is not a function

你能解释一下我的代码有什么问题以及如何解决吗？

谢谢！

Answer 1

发生这种情况是因为您在执行getMoment.toDate()时正在将时刻对象转换为日期对象（请检查此）。 由于您正在使用setMoment更改状态，因此页面会重新呈现，该页面又会调用const firstWeek = today.clone() （App 功能组件的第 3 行），并且由于 today 是一个 Date 对象，它没有一个克隆函数，错误被抛出。 您可以使用以下代码将时刻设置回当前时间。

 <button onClick={()=>{setMoment(moment())}}>this month</button>