72 lines
		
	
	
		
			1.6 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			72 lines
		
	
	
		
			1.6 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
import React, { useState, useEffect, useMemo, useRef } from "react";
 | 
						|
import { connect } from "dva";
 | 
						|
import { withRouter, matchPath } from "dva/router";
 | 
						|
import { Scrollbars } from "react-custom-scrollbars";
 | 
						|
import { Button, Icon } from "antd";
 | 
						|
import EnergyIcon from "../utils/energyIcon";
 | 
						|
import { $consts } from "../plugins";
 | 
						|
import styles from "./toggle.less";
 | 
						|
 | 
						|
const Toggle = (props) => {
 | 
						|
  const [num, setNum] = useState(1);
 | 
						|
  const [leftDis, setleftDis] = useState(false);
 | 
						|
  const [rightDis, setrightDis] = useState(false);
 | 
						|
  const {getNum} =props;
 | 
						|
 | 
						|
  const leftClick = () => {
 | 
						|
    if (num > 1) {
 | 
						|
      setNum(num - 1);
 | 
						|
     
 | 
						|
    }
 | 
						|
  };
 | 
						|
  const rightClick = () => {
 | 
						|
    if (num < 2) {
 | 
						|
      setNum(num + 1);
 | 
						|
    }
 | 
						|
  };
 | 
						|
  useEffect(() => {
 | 
						|
    if (num === 1) {
 | 
						|
      setleftDis(true);
 | 
						|
      setrightDis(false);
 | 
						|
    }
 | 
						|
    if (num === 2) {
 | 
						|
      setrightDis(true);
 | 
						|
      setleftDis(false);
 | 
						|
    }
 | 
						|
    getNum(num)
 | 
						|
  },[num]);
 | 
						|
//   useEffect(() => {
 | 
						|
//     return()=>{
 | 
						|
//        getNum(num) 
 | 
						|
//     }
 | 
						|
    
 | 
						|
    
 | 
						|
//   },[num]);
 | 
						|
 
 | 
						|
 | 
						|
  return (
 | 
						|
    <div className={styles.toggle}>
 | 
						|
      <div className={styles.toggleLeft} onClick={leftClick}>
 | 
						|
        {/* <Icon type="left-circle"></Icon> */}
 | 
						|
        <Button
 | 
						|
          type="primary"
 | 
						|
          shape="circle"
 | 
						|
          icon="left"
 | 
						|
          size="small"
 | 
						|
          disabled={leftDis}
 | 
						|
        />
 | 
						|
      </div>
 | 
						|
      <div className={styles.toggleRight} onClick={rightClick}>
 | 
						|
        <Button
 | 
						|
          type="primary"
 | 
						|
          shape="circle"
 | 
						|
          icon="right"
 | 
						|
          size="small"
 | 
						|
          disabled={rightDis}
 | 
						|
        />
 | 
						|
      </div>
 | 
						|
    </div>
 | 
						|
  );
 | 
						|
};
 | 
						|
export default withRouter(connect(({ login }) => ({ login }))(Toggle));
 |