制作企业网站html,wordpress转中文,西安市城乡建设管理局网站6,军事新闻今天目录
前言
代码
简要
引用
效果 前言 我是歌谣 放弃很容易 但是坚持一定很酷 为了保证react代码的一个简洁性 最近开始封装组件, 直接上代码 因为都很简单的模式 这边直接进行讲解 代码
//取消机构和取消讲师的方法封装
//params visible控制弹框的一个现实和隐藏
import…目录
前言
代码
简要
引用
效果 前言 我是歌谣 放弃很容易 但是坚持一定很酷 为了保证react代码的一个简洁性 最近开始封装组件, 直接上代码 因为都很简单的模式 这边直接进行讲解 代码
//取消机构和取消讲师的方法封装
//params visible控制弹框的一个现实和隐藏
import React from react;
import {Modal,Icon,Button } from antd;class CancelModel extends React.Component {stata {}//控制确定调用的函数handleOk() {this.props.handleOkthis.props.handleOk();}//控制弹窗的一个关闭handleCancel() {this.props.handleCancelthis.props.handleCancel();}//控制页面跳转的参数handleSkip() {// this.props.handleSkipthis.props.handleSkip();} render() {const {cancleVisible}this.propsreturn (divModaltitle提示visible{cancleVisible}onOk{this.handleOk}onCancel{this.handleCancel}style{{textAlign:center}}Icon typeexclamation-circle /p该讲师关联相关课程,不可取消该讲师/p{/* Button typelink block onClick{this.handleSkip}点击跳转/Button */}/Modal/div)}
}export default CancelModel简要 1this.props.handleCancelthis.props.handleCancel();判断方法名是否存在 2 const {cancleVisible}this.props父组件绑定值进行弹出框的显示和隐藏 3 this.props.handleCancelthis.props.handleCancel();想父组件传入方法 引用
import CancelModel from ./ComponentsList/cancleModel CancelModel handleOk{this.handleLectureOk}cancleVisible{cancleVisible} handleCancel{this.handleLectureCancle} /
效果
