VIP32/react/react高阶/project3/src/components/Header.jsx

import {Link,NavLink} from 'react-router-dom';
import './Header.css';
function Header() {
    const handleActive = ({ isActive, isPending }) =>
    isPending ? "pending" : isActive ? "active" : "normal"
    return (
        <>
        {/* 声明式导航：Link NavLink */}
            <ul className='header'>
                <li>
                    <NavLink className={handleActive} to={{pathname:'/'}}>首页</NavLink>
                </li>
                <li>
                    <NavLink className={handleActive} to="/my">我的</NavLink>
                </li>
            </ul>
        </>
    )
}
export default Header;