Showing
1 changed file
with
7 additions
and
4 deletions
1 | import { useContext } from "react"; | 1 | import { useContext } from "react"; |
2 | +import { useNavigate } from "react-router-dom"; | ||
2 | import { CalendarStateContext } from "../pages/Calendar"; | 3 | import { CalendarStateContext } from "../pages/Calendar"; |
3 | import "../styles/Header.css"; | 4 | import "../styles/Header.css"; |
4 | 5 | ||
5 | const Header = () => { | 6 | const Header = () => { |
6 | const [state, setState] = useContext(CalendarStateContext); | 7 | const [state, setState] = useContext(CalendarStateContext); |
7 | 8 | ||
8 | - const handleChangeState = (e) => { | 9 | + const navigate = useNavigate(); |
10 | + const setScope = (e) => { | ||
9 | setState({ | 11 | setState({ |
10 | ...state, | 12 | ...state, |
11 | [e.target.name]: e.target.value, | 13 | [e.target.name]: e.target.value, |
12 | }); | 14 | }); |
15 | + navigate("/calendar/" + e.target.value); | ||
13 | }; | 16 | }; |
14 | 17 | ||
15 | const gotoToday = () => { | 18 | const gotoToday = () => { |
... | @@ -78,7 +81,7 @@ const Header = () => { | ... | @@ -78,7 +81,7 @@ const Header = () => { |
78 | <div className="hrd"> | 81 | <div className="hrd"> |
79 | <button | 82 | <button |
80 | disabled={state.scope === "day"} | 83 | disabled={state.scope === "day"} |
81 | - onClick={handleChangeState} | 84 | + onClick={setScope} |
82 | name="scope" | 85 | name="scope" |
83 | value="day" | 86 | value="day" |
84 | > | 87 | > |
... | @@ -86,7 +89,7 @@ const Header = () => { | ... | @@ -86,7 +89,7 @@ const Header = () => { |
86 | </button> | 89 | </button> |
87 | <button | 90 | <button |
88 | disabled={state.scope === "week"} | 91 | disabled={state.scope === "week"} |
89 | - onClick={handleChangeState} | 92 | + onClick={setScope} |
90 | name="scope" | 93 | name="scope" |
91 | value="week" | 94 | value="week" |
92 | > | 95 | > |
... | @@ -94,7 +97,7 @@ const Header = () => { | ... | @@ -94,7 +97,7 @@ const Header = () => { |
94 | </button> | 97 | </button> |
95 | <button | 98 | <button |
96 | disabled={state.scope === "month"} | 99 | disabled={state.scope === "month"} |
97 | - onClick={handleChangeState} | 100 | + onClick={setScope} |
98 | name="scope" | 101 | name="scope" |
99 | value="month" | 102 | value="month" |
100 | > | 103 | > | ... | ... |
-
Please register or login to post a comment