内嵌滚动条未出现时滚动异常bug修改2168

src/components/SpreadDrop/index.jsx

@@ -427,6 +427,7 @@ class ListItems extends Component{
 class ListItem extends Component{
   constructor(props){
     super(props);
+    this.getData = this.getData.bind(this);
   }
   handleClick(e,item,i){
     e.stopPropagation();
@@ -479,9 +480,8 @@ class ListItem extends Component{
       return '';
     }
   }
-  render(){
+  getData(){
     const {datas,isSpecialPos} = this.props;
-    const pos = isSpecialPos?style['independent']:'';
     const contStyle={
       opacity:'0.4',
       right:'0',
@@ -490,23 +490,36 @@ class ListItem extends Component{
       width:'6px',
       background:'#f1f1f1'};
     const barStyle={background:'#777',width:'100%'};
-    return <ul className={classNames(style['row'],pos)} onBlur={(e)=>e.stopPropagation()}>
-    <ScrollArea speed={0.8}
-    horizontal={false}
-    stopScrollPropagation={datas.length>11?true:false}
-    style={{maxHeight:'330px'}}
-    className={style["area"]}
-    verticalContainerStyle={contStyle}
-    verticalScrollbarStyle={barStyle}
-    contentClassName="content">
-      {datas&&datas.map((it,i)=>{
-        if(isSpecialPos){
-          return <li onClick={(e)=>this.handleClick(e,it,i)} className={this.getClass(it.id)}>{it.name}</li>
-        }
-        return <li onClick={(e)=>this.handleClick(e,it,i)} className={this.getClass(it.id)} title={it.name.length>8?it.name:''}>{it.name&&it.name.length>8?it.name.slice(0,8)+'...':it.name}</li>
-      })}
-      </ScrollArea>
-    </ul>;
+    if(datas.length>11){
+      return <ScrollArea speed={0.8}
+                    horizontal={false}
+                    stopScrollPropagation={true}
+                    style={{maxHeight:'330px'}}
+                    className={style["area"]}
+                    verticalContainerStyle={contStyle}
+                    verticalScrollbarStyle={barStyle}
+                    contentClassName="content">
+          {datas&&datas.map((it,i)=>{
+            if(isSpecialPos){
+              return <li onClick={(e)=>this.handleClick(e,it,i)} className={this.getClass(it.id)}>{it.name}</li>
+            }
+            return <li onClick={(e)=>this.handleClick(e,it,i)} className={this.getClass(it.id)} title={it.name.length>8?it.name:''}>{it.name&&it.name.length>8?it.name.slice(0,8)+'...':it.name}</li>
+          })}
+        </ScrollArea>;
+    }
+    return datas&&datas.map((it,i)=>{
+      if(isSpecialPos){
+        return <li onClick={(e)=>this.handleClick(e,it,i)} className={this.getClass(it.id)}>{it.name}</li>
+      }
+      return <li onClick={(e)=>this.handleClick(e,it,i)} className={this.getClass(it.id)} title={it.name.length>8?it.name:''}>{it.name&&it.name.length>8?it.name.slice(0,8)+'...':it.name}</li>
+    });
+  }
+  render(){
+    const {datas,isSpecialPos} = this.props;
+    const pos = isSpecialPos?style['independent']:'';
+    return  <ul className={classNames(style['row'],pos)} onBlur={(e)=>e.stopPropagation()}>
+      {this.getData()}
+    </ul>
   }
 }
 export default SpreadDrop;