React之一个组件的诞生

此处以input组件为例

input.js

import React from 'react'

 class Input extends React.Component {

 
// ps:使用static方式为ES7草案语法,需要使用安装babel-preset-stage-0,并在webpack的预设中配置stage-0
// 如:.babelrc中配置

  //{
  //  "presets": [
  //  "react",
  //  "es2015",
  //  "stage-0"
  //  ]
  //}

    //********************************************************

   //static defaultProps = {

  //  type: 'text',
  //}
  //static propTypes = {
  //  placeholder: React.PropTypes.string,
  //  value: React.PropTypes.string,
  //  type: React.PropTypes.string.isRequired,
  /    constructor(props) {

        super(props);
        console.log(this.props);
    }
    render () {
        
        return (
            <input {...this.props}/>
      )
  }
}
Input.defaultProps = {
 type: 'text'
}
Input.propTypes
= { placeholder: React.PropTypes.string, value: React.PropTypes.string, type: React.PropTypes.string.isRequired, } export default Input;

 

posted @ 2017-07-19 17:33  cattleya  阅读(159)  评论(0)    收藏  举报