PasswordField.js 1.6 KB
import React,{PropTypes} from 'react';
import ReactDOM from 'react-dom';   
import cx from 'classnames';
import s from './reduxfields.scss'; 


class PasswordField extends React.Component {
    constructor(props) {
        super(props);  
        this.validationState=this.validationState.bind(this);
    }
    static propTypes = {    
        field:PropTypes.object,
        onChange:PropTypes.func,
        onKeyUp:PropTypes.func,
        placeholder:PropTypes.string
    } 
    static defaultProps={   
        placeholder:''
    }  
    validationState(field){
        // console.log('进入验证')
        if(field.error&&field.touched){
            console.log('1')
            return 'error';
        }else if(field.touched){
        console.log('2')
            return null;

        }else{
            console.log('3')
            return null;
        }
    } 
    componentDidMount(){  
    }  
    componentWillReceiveProps(nextProps){   
    }
    componentDidUpdate(prevProps,prevState){  
    }
    componentWillUnmount() {  
        
    }  
    render(){       
        const {field,onChange,placeholder,onKeyUp}=this.props;
        // console.log('验证的field',field)
        // console.log('验证的field.touched',field.touched)
        // console.log('验证的field.error',field.error)
        return (
            <div > 
                <input type="password" onKeyUp={onKeyUp} onChange={field.onChange} placeholder={placeholder} value={field.value}  /> 
                <div>{field.touched?field.error:''}</div>
            </div>
        ) 
    }
}



export default PasswordField;