mirror of
https://github.com/MrXujiang/h5-Dooring.git
synced 2026-02-07 10:45:33 +00:00
fix: 缩放bug修复
This commit is contained in:
parent
4fe8fcb9da
commit
783849a542
@ -1,11 +1,10 @@
|
|||||||
import React, { useState, useEffect, useMemo, useContext, useRef } from 'react';
|
import React, { useState, useEffect, useMemo, useContext, useRef } from 'react';
|
||||||
import { Slider, Result, Tabs } from 'antd';
|
import { Result, Tabs } from 'antd';
|
||||||
import {
|
import {
|
||||||
PieChartOutlined,
|
PieChartOutlined,
|
||||||
ExpandOutlined,
|
ExpandOutlined,
|
||||||
PlayCircleOutlined,
|
PlayCircleOutlined,
|
||||||
HighlightOutlined,
|
HighlightOutlined,
|
||||||
ReloadOutlined,
|
|
||||||
DoubleRightOutlined,
|
DoubleRightOutlined,
|
||||||
DoubleLeftOutlined,
|
DoubleLeftOutlined,
|
||||||
} from '@ant-design/icons';
|
} from '@ant-design/icons';
|
||||||
@ -30,7 +29,7 @@ import schema2 from 'components/BasicPcShop/schema';
|
|||||||
import { ActionCreators } from 'redux-undo';
|
import { ActionCreators } from 'redux-undo';
|
||||||
import { StateWithHistory } from 'redux-undo';
|
import { StateWithHistory } from 'redux-undo';
|
||||||
import styles from './index.less';
|
import styles from './index.less';
|
||||||
import { useGetBall } from 'react-draggable-ball';
|
// import { useGetBall } from 'react-draggable-ball';
|
||||||
import { dooringContext } from '@/layouts';
|
import { dooringContext } from '@/layouts';
|
||||||
import { throttle } from '@/utils/tool';
|
import { throttle } from '@/utils/tool';
|
||||||
|
|
||||||
@ -124,16 +123,12 @@ const Container = (props: {
|
|||||||
};
|
};
|
||||||
}, [CpIcon]);
|
}, [CpIcon]);
|
||||||
|
|
||||||
const handleSliderChange = (v: number) => {
|
|
||||||
setScale(prev => (v >= 150 ? 1.5 : v / 100));
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleSlider = useMemo(() => {
|
const handleSlider = useMemo(() => {
|
||||||
return (type: any) => {
|
return (type: any) => {
|
||||||
if (type) {
|
if (type) {
|
||||||
setScale(prev => (prev >= 1.5 ? 1.5 : prev + 0.1));
|
setScale((prev: number) => +(prev + 0.1).toFixed(1));
|
||||||
} else {
|
} else {
|
||||||
setScale(prev => (prev <= 0.5 ? 0.5 : prev - 0.1));
|
setScale((prev: number) => +(prev - 0.1).toFixed(1));
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
}, []);
|
}, []);
|
||||||
@ -506,25 +501,24 @@ const Container = (props: {
|
|||||||
<ReloadOutlined onClick={() => setDragState({ x: 0, y: 0 })} />
|
<ReloadOutlined onClick={() => setDragState({ x: 0, y: 0 })} />
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.controllBall}>{render}</div> */}
|
<div className={styles.controllBall}>{render}</div> */}
|
||||||
|
|
||||||
<div className={styles.sliderWrap}>
|
<div className={styles.sliderWrap}>
|
||||||
<span
|
<span
|
||||||
style={{ marginLeft: '13px' }}
|
|
||||||
className={styles.sliderBtn}
|
className={styles.sliderBtn}
|
||||||
onClick={handleSlider.bind(this, 1)}
|
onClick={handleSlider.bind(this, 1)}
|
||||||
|
style={
|
||||||
|
scaleNum == 1
|
||||||
|
? { pointerEvents: 'none' }
|
||||||
|
: { display: 'initial', marginLeft: '13px' }
|
||||||
|
}
|
||||||
>
|
>
|
||||||
+
|
+
|
||||||
</span>
|
</span>
|
||||||
{/* <Slider
|
|
||||||
defaultValue={100}
|
|
||||||
className={styles.slider}
|
|
||||||
onChange={handleSliderChange}
|
|
||||||
min={50}
|
|
||||||
max={150}
|
|
||||||
value={scaleNum * 100}
|
|
||||||
/> */}
|
|
||||||
<span>{scaleNum * 100}%</span>
|
<span>{scaleNum * 100}%</span>
|
||||||
<span className={styles.sliderBtn} onClick={handleSlider.bind(this, 0)}>
|
<span
|
||||||
|
className={styles.sliderBtn}
|
||||||
|
style={scaleNum == 0.1 ? { pointerEvents: 'none' } : { display: 'initial' }}
|
||||||
|
onClick={handleSlider.bind(this, 0)}
|
||||||
|
>
|
||||||
-
|
-
|
||||||
</span>
|
</span>
|
||||||
<span className={styles.backSize}>
|
<span className={styles.backSize}>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user