message: refactor: finish switch
diff: -import React, { Component } from 'react'
  -import PropTypes from 'prop-types'
  +import React, { useState, useCallback, useEffect } from 'react'
  import classNames from 'classnames'
  -import Provider from '../context'
  import './style/index'
  -class Switch extends Component {
  - constructor (props) {
  - super(props)
  - this.state = {
  - checked: props.checked
  - }
  - }
  +const Switch = ({ content = [], disabled = false, checked, defaultChecked, onChange, onClick }) => {
  + const [value, setValue] = useState(checked || defaultChecked || false)
  - componentWillReceiveProps (nextProps) {
  - if (nextProps.checked !== this.props.checked) {
  - this.setState({ checked: nextProps.checked }, () => {
  - this.props.onChange(nextProps.checked)
  - })
  - }
  + useEffect(() => {
  + if (checked !== undefined) {
  + setValue(checked)
  }
  + }, [checked])
  - clickEvent () {
  - const { disabled, onChange, onClick } = this.props
  + const clickSwitch = useCallback(
  + (e) => {
  if (!disabled) {
  - const res = onClick(this.state.checked)
  - if (typeof res === 'boolean' && !res) {
  - return
  + if (onClick) {
  + onClick(!value, e)
  }
  - this.setState({ checked: !this.state.checked }, () => {
  - onChange(this.state.checked)
  - })
  + if (onChange) {
  + onChange(!value)
  }
  + if (checked === undefined) {
  + setValue(!value)
  }
  -
  - render () {
  - const { theme, content, disabled } = this.props
  - const { checked } = this.state
  - const sCls = classNames(
  - 'theme__' + theme,
  - 'hi-switch',
  - !checked && 'hi-switch--closed',
  - disabled && 'hi-switch--disabled'
  + }
  + },
  + [disabled, onChange, onClick]
  )
  +
  return (
  - <span className={sCls} onClick={this.clickEvent.bind(this)}>
  - <span className='hi-switch__text'>
  - {content.length > 0 && (checked ? content[0] : content[1])}
  - </span>
  + <span
  + className={classNames('hi-switch', !checked && 'hi-switch--closed', disabled && 'hi-switch--disabled')}
  + onClick={clickSwitch}
  + >
  + <span className='hi-switch__text'>{content.length > 0 && (value ? content[0] : content[1])}</span>
  </span>
  )
  }
  -}
  -Switch.defaultProps = {
  - content: [],
  - checked: false,
  - disabled: false,
  - onChange: () => {},
  - onClick: () => {
  - return true
  - }
  -}
  -Switch.propTypes = {
  - content: PropTypes.array,
  - checked: PropTypes.bool,
  - disabled: PropTypes.bool,
  - onChange: PropTypes.func,
  - onClick: PropTypes.func
  -}
  -export default Provider(Switch)
  +export default Switch
  