react 父子组件传值

时间:2021-02-03 10:29:31   收藏:0   阅读:0
//父组件

const LayoutMain = ()=>{
  const  [flowImg,setFlowImg] = useState(false);
  const openModal = ()=>{
    setFlowImg(true)
    console.log(flowImg);
  }
  const handleOk = ()=>{
    setFlowImg(false)
  }
  const handleCancel = ()=>{
    setFlowImg(false)
  }
  return(<div>
    <button onClick={openModal}>打开modal</button>
    <FlowImg handleOk={handleOk} handleCancel={handleCancel} isModalVisible={flowImg}/>  //属性传值/传事件
  </div>)
}
export default LayoutMain;


//子组件
const FlowImg =(props)=>{
  const { isModalVisible, handleOk,handleCancel} = props;//子组件 用props 接收值和事件
  return(<div>
      <Modal title="Basic Modal" visible={isModalVisible} onOk={handleOk} onCancel={handleCancel}>
        <p>Some contents...</p>
        <p>Some contents...</p>
        <p>Some contents...</p>
      </Modal>
  </div>)
}

 

评论(0
© 2014 mamicode.com 版权所有 京ICP备13008772号-2  联系我们:gaon5@hotmail.com
迷上了代码!