![](/img/trans.png)
[英]ReactJS DataCloneError: Failed to execute 'pushState' on 'History': MouseEvent object could not be cloned
[英]DataCloneError: Failed to execute 'pushState' on 'History'
我是 Reactjs 的新手。我想从用户输入日期范围并将其传递到第二页(搜索)但是我收到错误(DataCloneError:无法在“历史”上执行“pushState”。)当我传递状态 endDate 和startDate。当我传递任何示例字符串(示例 - startdate:“sample”)时,它工作正常。 请帮我摆脱这个错误。
import React from "react";
import { Link } from "react-router-dom";
import "react-bootstrap";
import { DateRangePicker } from "react-dates";
import "react-dates/initialize";
import "react-dates/lib/css/_datepicker.css";
function Filters() {
const [dateRange, setdateRange] = React.useState({
startDate: null,
endDate: null,
});
const [focus, setFocus] = React.useState(null);
const { startDate, endDate } = dateRange;
return (<>
<DateRangePicker
startDatePlaceholderText="Check-in"
endDatePlaceholderText="Check-out"
startDate={startDate}
endDate={endDate}
numberOfMonths={1}
onDatesChange={({ startDate, endDate }) =>
setdateRange({ startDate, endDate })
}
showClearDates={true}
focusedInput={focus}
onFocusChange={(focus) => setFocus(focus)}
startDateId="startDateMookh"
endDateId="endDateMookh"
minimumNights={1}
/>
<Link to={{ pathname: "/search", state: {
startdate: "startdate",
enddate: endDate,
},}}>
<div className="search">
<p>Search</p>
</div>
</Link>
</>
);
}
export default Filters;
这是第二页(搜索)
import React from "react";
import Hotellist from "./components/hotellist";
import Filters from "./components/filters";
import { useLocation } from "react-router";
function List() {
const location = useLocation();
const {startdate, enddate} = location.state;
console.log(startdate, enddate);
return (
<>
</>
);
}
我能找到的是 startDate 和 endDate 不仅仅是日期。 他们拥有比这更多的数据。 仅获取日期或将数据发送到其他页面使用时刻
import moment from "moment"
Send it like this
startdate: moment(startDate).format("yyyy-MM-dd")
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.