diff --git a/src/DropdownMenu.jsx b/src/DropdownMenu.jsx index b4704c71b..6192fd9ea 100644 --- a/src/DropdownMenu.jsx +++ b/src/DropdownMenu.jsx @@ -1,14 +1,13 @@ import React, { cloneElement } from 'react'; import { findDOMNode } from 'react-dom'; import PropTypes from 'prop-types'; -import createClass from 'create-react-class'; import toArray from 'rc-util/lib/Children/toArray'; import Menu from 'rc-menu'; import scrollIntoView from 'dom-scroll-into-view'; import { getSelectKeys, preventDefaultEvent } from './util'; -const DropdownMenu = createClass({ - propTypes: { +export default class DropdownMenu extends React.Component { + static propTypes= { defaultActiveFirstOption: PropTypes.bool, value: PropTypes.any, dropdownMenuStyle: PropTypes.object, @@ -20,16 +19,16 @@ const DropdownMenu = createClass({ menuItems: PropTypes.any, inputValue: PropTypes.string, visible: PropTypes.bool, - }, + } componentWillMount() { this.lastInputValue = this.props.inputValue; - }, + } componentDidMount() { this.scrollActiveItemToView(); this.lastVisible = this.props.visible; - }, + } shouldComponentUpdate(nextProps) { if (!nextProps.visible) { @@ -37,7 +36,7 @@ const DropdownMenu = createClass({ } // freeze when hide return nextProps.visible; - }, + } componentDidUpdate(prevProps) { const props = this.props; @@ -46,9 +45,9 @@ const DropdownMenu = createClass({ } this.lastVisible = props.visible; this.lastInputValue = props.inputValue; - }, + } - scrollActiveItemToView() { + scrollActiveItemToView = () => { // scroll into view const itemComponent = findDOMNode(this.firstActiveItem); if (itemComponent) { @@ -56,7 +55,7 @@ const DropdownMenu = createClass({ onlyScrollIfNeeded: true, }); } - }, + } renderMenu() { const props = this.props; @@ -127,7 +126,7 @@ const DropdownMenu = createClass({ ); } return null; - }, + } render() { const renderMenu = this.renderMenu(); @@ -140,8 +139,7 @@ const DropdownMenu = createClass({ {renderMenu} ) : null; - }, -}); + } +} DropdownMenu.displayName = 'DropdownMenu'; -export default DropdownMenu; diff --git a/src/SelectTrigger.jsx b/src/SelectTrigger.jsx index 46581c235..21140ae1e 100644 --- a/src/SelectTrigger.jsx +++ b/src/SelectTrigger.jsx @@ -1,7 +1,6 @@ import Trigger from 'rc-trigger'; import React from 'react'; import PropTypes from 'prop-types'; -import createClass from 'create-react-class'; import classnames from 'classnames'; import DropdownMenu from './DropdownMenu'; import ReactDOM from 'react-dom'; @@ -28,8 +27,8 @@ const BUILT_IN_PLACEMENTS = { }, }; -const SelectTrigger = createClass({ - propTypes: { +export default class SelectTrigger extends React.Component { + static propTypes= { onPopupFocus: PropTypes.func, dropdownMatchSelectWidth: PropTypes.bool, dropdownAlign: PropTypes.object, @@ -44,7 +43,7 @@ const SelectTrigger = createClass({ prefixCls: PropTypes.string, popupClassName: PropTypes.string, children: PropTypes.any, - }, + } componentDidUpdate() { const { visible, dropdownMatchSelectWidth } = this.props; @@ -55,17 +54,17 @@ const SelectTrigger = createClass({ dropdownDOMNode.style[widthProp] = `${ReactDOM.findDOMNode(this).offsetWidth}px`; } } - }, + } - getInnerMenu() { + getInnerMenu = () => { return this.popupMenu && this.popupMenu.refs.menu; - }, + } - getPopupDOMNode() { + getPopupDOMNode = () => { return this.refs.trigger.getPopupDomNode(); - }, + } - getDropdownElement(newProps) { + getDropdownElement = (newProps) => { const props = this.props; return (); - }, + } - getDropdownTransitionName() { + getDropdownTransitionName = () => { const props = this.props; let transitionName = props.transitionName; if (!transitionName && props.animation) { transitionName = `${this.getDropdownPrefixCls()}-${props.animation}`; } return transitionName; - }, + } - getDropdownPrefixCls() { + getDropdownPrefixCls = () => { return `${this.props.prefixCls}-dropdown`; - }, + } - saveMenu(menu) { + saveMenu = (menu) => { this.popupMenu = menu; - }, + } + render() { const { onPopupFocus, ...props } = this.props; const { multiple, visible, inputValue, dropdownAlign, @@ -135,9 +135,7 @@ const SelectTrigger = createClass({ popupClassName={classnames(popupClassName)} popupStyle={props.dropdownStyle} >{props.children}); - }, -}); + } +} SelectTrigger.displayName = 'SelectTrigger'; - -export default SelectTrigger;