我想要写一个示例，让Child修改Parent组件的状态， 但是如何定义Child的Props的修改Parent的状态的type呢？

作者站长头像
站长
· 阅读数 18

我想要写一个示例，让Child修改Parent组件的状态，但是如何定义Child的Props呢？

// parent
import React, { useState } from 'react'

import Child from './child'

function Parent() {

  const [msg, setMsg] = useState('111')

  return (
    <div style={{ backgroundColor: 'blue' }}>{msg}
      <Child handleClick={setMsg}></Child>
    </div>
  )
}

export default Parent
// child 
import { Button } from 'antd'
import React from 'react'



type ChildProps = {
  handleClick: //  这里应该如何定义呢？
}

function Child(props: ChildProps) {
  return (
    <div style={{backgroundColor: 'red'}}>child
      <Button 
        onClick={() => {
          props.setMsg('您好')
        }}>
        点击
      </Button>
    </div>
  )
}

export default Child

代码如上述，如何定义ChildProps 的hanldClick的type呢？

回复
1个回答
avatar
test
2024-06-27

handleClick: (msg: string) => void handleClick: React.Dispatch<React.SetStateAction<string>>;

回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引，对解决问题有帮助
  • 遵循 Markdown 语法排版，代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容