男女切换显示异常修复

src/components/PatInfo/Select/index.jsx

@@ -8,8 +8,8 @@ import { embedPush } from '../../../store/async-actions/pushMessage'
 export default class Select extends Component {
   constructor(props) {
     super(props);
-    this.state = { 
-      isOpen: false, 
+    this.state = {
+      isOpen: false,
       value: "",
       options: [
         {
@@ -47,7 +47,8 @@ export default class Select extends Component {
     window.removeEventListener("click", this.onClickOutsideHandler);
   }
 
-  componentWillReceiveProps(nextProps){
+  componentWillReceiveProps(nextProps) {
+    // console.log(nextProps, '================nextProps');
     if (nextProps.default.value !== this.state.value.value) {
       this.setState({
         value: nextProps.default
@@ -70,7 +71,7 @@ export default class Select extends Component {
     }
   };
 
-  onChange(e,val) {
+  onChange(e, val) {
     const state = store.getState();
     e.stopPropagation()
     this.setState({
@@ -87,21 +88,22 @@ export default class Select extends Component {
       mode: 1
     }))
   };
-  handleMouseEnter(){
+  handleMouseEnter() {
     // console.log('鼠标进入');
     this.setState({
       isEnter: true
     })
   }
-  handleMouseLeave(){
+  handleMouseLeave() {
     // console.log('鼠标进入');
     this.setState({
       isEnter: false
     })
   }
   render() {
-    const { isOpen, value, options} = this.state;
-    const { label,  placeholder } = this.props;
+    const { isOpen, value, options } = this.state;
+    const { label, placeholder } = this.props;
+    // console.log(options, '===============options');
     return (
       <div className={style.selectBox}>
         {label && <label className={style.label}>{label}:</label>}
@@ -110,15 +112,15 @@ export default class Select extends Component {
           <input
             className={[style.selfInput, isOpen ? style.selfInput : ''].join('')}
             readonly=""
-            value={value.value=== 2? '女' : '男'}
+            value={value.value == 2 ? '女' : '男'}
             onClick={this.onClickHandler}
             placeholder={placeholder}
           />
           <div className={this.state.isEnter ? style.downActive : style.down} onClick={this.onClickHandler} onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave}>
-            <img src={selectSex} alt=""/>
+            <img src={selectSex} alt="" />
           </div>
-          <div  className={[isOpen ? '' : style.optionsHidden, isOpen ? style.options :''].join('')}>
-            {options &&
+          <div className={[isOpen ? '' : style.optionsHidden, isOpen ? style.options : ''].join('')}>
+            {/* {options &&
               options.map((item) => {
                 return (
                   <div
@@ -126,10 +128,12 @@ export default class Select extends Component {
                     className={style.item}
                     onClick={(e)=>this.onChange( e, item)}
                   >
-                    {item.value === 2 ? '女' : '男'}
+                    {+item.value == 2 ? '女' : '男'}
                   </div>
                 );
-              })}
+              })} */}
+            <div className={style.item} onClick={(e) => this.onChange(e, options[0])}>男</div>
+            <div className={style.item} onClick={(e) => this.onChange(e, options[1])}>女</div>
           </div>
         </div>
       </div>