2021-12-07 23:54:42 +08:00

32 lines
528 B
TypeScript

import React, { useState } from 'react'
const STATUS = {
HOVERED: 'hovered',
NORMAL: 'normal',
}
const Link = ({ page, children }: any) => {
const [status, setStatus] = useState(STATUS.NORMAL)
const onMouseEnter = () => {
setStatus(STATUS.HOVERED)
}
const onMouseLeave = () => {
setStatus(STATUS.NORMAL)
}
return (
<a
className={status}
href={page || '#'}
onMouseEnter={onMouseEnter}
onMouseLeave={onMouseLeave}
>
{children}
</a>
)
}
export default Link