tsx 控件结构 - ythy/blog GitHub Wiki

import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { findDOMNode } from 'react-dom';

export interface IdentifyCodeProps{
  className?: string; 
  children?: any; 
  style?: React.CSSProperties; 

  duration?: number;
  defaultBtnText?: string;
}

interface IdentifyCodeState{
  countDownNumber?: number;
}

export default class IdentifyCode extends Component<IdentifyCodeProps, IdentifyCodeState> {

  static defaultProps = {
    duration: 6,
    defaultBtnText: '发送验证码',
  }

  constructor(props: IdentifyCodeProps) { 
    super(props); 
    this.state = {
      countDownNumber: 0,
    }
  } 

  onButtonClick = ( event:React.MouseEvent<HTMLButtonElement> )=>{

  }

  render () {
    const { duration, defaultBtnText, ...restProps } = this.props;
    const { countDownNumber } = this.state;
    return (
      <button {...restProps}  onClick={this.onButtonClick} > 
	{buttonText} 
      </button>
    );

  }

}