From d093074a00881b60b3440a35503f0143612143a0 Mon Sep 17 00:00:00 2001
From: caojunchao <caojunchao@didichuxing.com>
Date: Thu, 9 Mar 2017 13:38:54 +0800
Subject: Fix the bug the Select's scrollbar flashes repeatedly in Chrome/macOS
 when always show scroll bars

---
 src/Select.jsx | 24 ++++++++++++++++++++++--
 1 file changed, 22 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/Select.jsx b/src/Select.jsx
index 5733b1a..deb155d 100644
--- a/src/Select.jsx
+++ b/src/Select.jsx
@@ -32,6 +32,12 @@ const Select = React.createClass({
     onMouseEnter: PropTypes.func,
   },
 
+  getInitialState() {
+    return {
+      active: false,
+    };
+  },
+
   componentDidMount() {
     // jump to selected option
     this.scrollToSelected(0);
@@ -87,17 +93,31 @@ const Select = React.createClass({
     scrollTo(select, to, duration);
   },
 
+  handleMouseEnter(e) {
+    this.setState({ active: true });
+    this.props.onMouseEnter(e);
+  },
+
+  handleMouseLeave() {
+    this.setState({ active: false });
+  },
+
   render() {
     if (this.props.options.length === 0) {
       return null;
     }
 
     const { prefixCls } = this.props;
+    const cls = classnames({
+      [`${prefixCls}-select`]: 1,
+      [`${prefixCls}-select-active`]: this.state.active,
+    });
 
     return (
       <div
-        className={`${prefixCls}-select`}
-        onMouseEnter={this.props.onMouseEnter}
+        className={cls}
+        onMouseEnter={this.handleMouseEnter}
+        onMouseLeave={this.handleMouseLeave}
       >
         <ul ref="list">{this.getOptions()}</ul>
       </div>
-- 
cgit v1.2.3