Selaa lähdekoodia

一般治疗默认收起

zhangxc 5 vuotta sitten
vanhempi
commit
371f679ce3

+ 17 - 3
src/components/Treat/GeneralTreat/index.jsx

@@ -2,23 +2,37 @@ import React, { Component } from 'react';
 import style from './index.less';
 import up from '@common/images/slide-up.png';
 import down from '@common/images/slide-down.png';
+import $ from 'jquery';
+import config from '@config/index';
 
 class GeneralTreat extends Component {
     constructor(props){
         super(props);
+        this.state = {
+            slideUp: false
+        }
+        this.$content = React.createRef();
     }
 
+    slideToggle() {
+        const { slideUp } = this.state
+        $(this.$content.current).slideToggle(config.slideTime);
+        this.setState({
+            slideUp: !slideUp
+        })
+    }
     render() {
         const { icon, titleStyle,titleBg, filter, title, generalTreat } = this.props
+        const { slideUp } = this.state
         return(
             generalTreat && generalTreat.content && generalTreat.content.length > 0 && <div className={style['general-wrapper']}>
                 <div className={style['general-title-box']} style={titleStyle}></div>
-                <div className={`${style['general-title']} ${'clearfix'}`}  onClick={this.slideToggle}>
+                <div className={`${style['general-title']} ${'clearfix'}`}  onClick={this.slideToggle.bind(this)}>
                     <img className={style['general-icon']} src={icon}/>
                     {title}
-                    <img  className={style['slide-toggle']} src={down}/>
+                    <img  className={style['slide-toggle']} src={slideUp?up:down} alt="展开/收起"/>
                 </div>
-                <div className={style['general-item']} dangerouslySetInnerHTML={{__html: generalTreat.content}}>
+                <div ref={this.$content} className={style['general-item']}  dangerouslySetInnerHTML={{__html: generalTreat.content}}>
                 </div>
 
             </div>

+ 1 - 1
src/components/Treat/GeneralTreat/index.less

@@ -24,7 +24,7 @@
     margin: 10px;
 }
 .general-item {
-    
+    display: none;
     line-height: 36px;
 }
 .slide-toggle {