ModalForm.js 1.7 KB
import React,{PropTypes} from 'react';   
import {connect} from 'react-redux';
import { Field, reduxForm,formValueSelector,getFormValues,destroy,submit} from 'redux-form';
import { Modal } from 'antd'; 

class ModalForm extends React.Component { 
 
    constructor(props) { 
      super(props);  
      this.state = { 
        component: null,
      }; 
    } 
    static propTypes = {
        form: PropTypes.string,  
        onSubmit: PropTypes.func,
        initialValues: PropTypes.object 
    }
    static defaultProps={ 
        form:'@@modal-form',    
        onSubmit   :(values)=>{},
        initialValues:{} 
    }
    componentDidMount() {   
      const { form,initialValues,onSubmit} = this.props;
      let MyModal = reduxForm({
          form                    : form,
          onSubmit                : onSubmit,
          initialValues           : initialValues
        })(Modal);
      this.setState({ 
        component: MyModal 
      }); 
    } 
    componentWillReceiveProps(nextProps){  
      const { visible,form,initialValues,onSubmit } = nextProps;
      const C = this.state.component; 
      if(visible&&!C){
        let MyModal = reduxForm({
            form                    : form,
            onSubmit                : onSubmit,
            initialValues           : initialValues
          })(Modal);
        this.setState({ 
          component: MyModal 
        }); 
      }else if(!visible){
        destroy(form);
        this.setState({ 
          component: null 
        }); 
      }
    }  
    render() { 
      const C = this.state.component;  
      return C 
        ? <C {...this.props}>
          {this.props.children}
        </C>
        : null; 
    } 
 
  } 
 
export default ModalForm;