Reactjs React类型脚本如何在MouseCenter上工作

我有这样一个组件：

const Componen: FC<Props> = ({}) => {

   const [title, setTitle] = React.useState("");

   return (
     <ChildComponent onMouseEnter={() => setTitle("some title")} />
     {title}
   )
}

---

但什么也没发生。因此，

onmouseinter

to

ChildComponent

setTitle不起作用

onmouseinter

在这里不是一个

eventHandler

，而只是

ChildComponent

的一个道具，它需要被

ChildComponent

使用并传递给包装div

const Componen: FC<Props> = ({}) => {

   const [title, setTitle] = React.useState("");

   return (
     <ChildComponent onMouseEnter={() => setTitle("some title")} />
     {title}
   )
}

const ChildComponent: FC<Props> = ({ onMouseEnter }) => (
   <div onMouseEnter={onMouseEnter}>
       {/* rest of code */}
   </div>
)

const Componen:FC=（{}）=>{
const[title，setTitle]=React.useState（“”）；
返回(
setTitle（“某些标题”）}/>
{title}
)
}
const ChildComponent:FC=（{onmouseinter}）=>(
{/*代码的其余部分*/}
)

现在，您需要通过将此事件绑定到HTML元素而不是组件来调用子组件中的

onMouseCenter

，您也可以发布

ChildComponent

的内容吗？为什么？我不能直接在组件上使用此事件？很抱歉，我这样做了：）

const Componen: FC<Props> = ({}) => {

   const [title, setTitle] = React.useState("");

   return (
     <ChildComponent onMouseEnter={() => setTitle("some title")} />
     {title}
   )
}

const ChildComponent: FC<Props> = ({ onMouseEnter }) => (
   <div onMouseEnter={onMouseEnter}>
       {/* rest of code */}
   </div>
)