X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;ds=sidebyside;f=src%2FSelect.jsx;h=49fed5b83c6911767c60d2156d7dd552ffedc5d3;hb=1630cc0d1942d079a80705cd000a48df9a58b355;hp=deb155ddbae5c7884c4efe6cd63c5076c415b5cd;hpb=d093074a00881b60b3440a35503f0143612143a0;p=github%2Ffretlink%2Ftime-picker.git diff --git a/src/Select.jsx b/src/Select.jsx index deb155d..49fed5b 100644 --- a/src/Select.jsx +++ b/src/Select.jsx @@ -1,4 +1,5 @@ -import React, { PropTypes } from 'react'; +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; import ReactDom from 'react-dom'; import classnames from 'classnames'; @@ -22,38 +23,36 @@ const scrollTo = (element, to, duration) => { }); }; -const Select = React.createClass({ - propTypes: { +class Select extends Component { + static propTypes = { prefixCls: PropTypes.string, options: PropTypes.array, selectedIndex: PropTypes.number, type: PropTypes.string, onSelect: PropTypes.func, onMouseEnter: PropTypes.func, - }, + }; - getInitialState() { - return { - active: false, - }; - }, + state = { + active: false, + }; componentDidMount() { // jump to selected option this.scrollToSelected(0); - }, + } componentDidUpdate(prevProps) { // smooth scroll to selected option if (prevProps.selectedIndex !== this.props.selectedIndex) { this.scrollToSelected(120); } - }, + } - onSelect(value) { + onSelect = (value) => { const { onSelect, type } = this.props; onSelect(type, value); - }, + } getOptions() { const { options, selectedIndex, prefixCls } = this.props; @@ -75,7 +74,7 @@ const Select = React.createClass({ {item.value} ); }); - }, + } scrollToSelected(duration) { // move to selected item @@ -91,16 +90,16 @@ const Select = React.createClass({ const topOption = list.children[index]; const to = topOption.offsetTop; scrollTo(select, to, duration); - }, + } - handleMouseEnter(e) { + handleMouseEnter = (e) => { this.setState({ active: true }); this.props.onMouseEnter(e); - }, + } - handleMouseLeave() { + handleMouseLeave = () => { this.setState({ active: false }); - }, + } render() { if (this.props.options.length === 0) { @@ -122,7 +121,7 @@ const Select = React.createClass({ ); - }, -}); + } +} export default Select;