should change method
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
* @Author: yehuozhili
|
||||
* @Date: 2021-02-21 22:17:29
|
||||
* @LastEditors: yehuozhili
|
||||
* @LastEditTime: 2021-07-17 11:24:59
|
||||
* @LastEditTime: 2021-07-19 10:11:14
|
||||
* @FilePath: \dooringx\packages\dooringx-lib\src\components\IframeWrapperMove\event.ts
|
||||
*/
|
||||
import { RefObject } from 'react';
|
||||
@@ -53,7 +53,7 @@ export const wrapperEvent = (ref: RefObject<HTMLDivElement>, config: UserConfig)
|
||||
}
|
||||
},
|
||||
onMouseMove: (e: React.MouseEvent) => {
|
||||
e.preventDefault();
|
||||
//e.preventDefault();
|
||||
if (wrapperMoveState.isDrag) {
|
||||
const diffX = e.clientX - wrapperMoveState.startX;
|
||||
const diffY = e.clientY - wrapperMoveState.startY;
|
||||
|
@@ -2,7 +2,7 @@
|
||||
* @Author: yehuozhili
|
||||
* @Date: 2021-07-17 10:08:08
|
||||
* @LastEditors: yehuozhili
|
||||
* @LastEditTime: 2021-07-17 22:13:51
|
||||
* @LastEditTime: 2021-07-19 17:36:44
|
||||
* @FilePath: \dooringx\packages\dooringx-lib\src\components\iframeContainer.tsx
|
||||
*/
|
||||
import { containerDragResolve } from '../core/crossDrag';
|
||||
@@ -138,7 +138,7 @@ function Container(props: PropsWithChildren<ContainerProps>) {
|
||||
}}
|
||||
{...(props.context === 'edit' ? containerDragResolve(props.config) : null)}
|
||||
{...(props.context === 'edit' ? innerContainerDrag(props.config) : null)}
|
||||
{...(props.context === 'edit' ? containerFocusRemove(props.config) : null)}
|
||||
{...(props.context === 'edit' ? containerFocusRemove(props.config, true) : null)}
|
||||
>
|
||||
{props.context === 'edit' && (
|
||||
<NormalMarkLineRender config={props.config}></NormalMarkLineRender>
|
||||
|
@@ -47,7 +47,7 @@ export const wrapperEvent = (ref: RefObject<HTMLDivElement>, config: UserConfig)
|
||||
}
|
||||
},
|
||||
onMouseMove: (e: React.MouseEvent) => {
|
||||
e.preventDefault();
|
||||
//e.preventDefault();
|
||||
if (wrapperMoveState.isDrag) {
|
||||
const diffX = e.clientX - wrapperMoveState.startX;
|
||||
const diffY = e.clientY - wrapperMoveState.startY;
|
||||
|
@@ -2,7 +2,7 @@
|
||||
* @Author: yehuozhili
|
||||
* @Date: 2021-03-14 04:29:09
|
||||
* @LastEditors: yehuozhili
|
||||
* @LastEditTime: 2021-07-13 14:43:14
|
||||
* @LastEditTime: 2021-07-19 17:34:54
|
||||
* @FilePath: \dooringx\packages\dooringx-lib\src\core\focusHandler\index.tsx
|
||||
*/
|
||||
import { innerDragState } from '../innerDrag/state';
|
||||
@@ -12,7 +12,7 @@ import { selectRangeMouseDown } from '../selectRange';
|
||||
import { unmountContextMenu } from '../contextMenu';
|
||||
import UserConfig from '../../config';
|
||||
|
||||
export function containerFocusRemove(config: UserConfig) {
|
||||
export function containerFocusRemove(config: UserConfig, iframe = false) {
|
||||
const store = config.getStore();
|
||||
|
||||
const onMouseDown = (e: React.MouseEvent) => {
|
||||
@@ -25,7 +25,7 @@ export function containerFocusRemove(config: UserConfig) {
|
||||
focusState.blocks = [];
|
||||
store.setData({ ...clonedata, block: newBlock });
|
||||
if (!innerDragState.item) {
|
||||
selectRangeMouseDown(e, config);
|
||||
selectRangeMouseDown(e, config, iframe);
|
||||
}
|
||||
unmountContextMenu();
|
||||
};
|
||||
|
@@ -53,7 +53,7 @@ export const innerContainerDrag = function (config: UserConfig) {
|
||||
const store = config.getStore();
|
||||
const scaleState = config.getScaleState();
|
||||
const onMouseMove = (e: React.MouseEvent) => {
|
||||
e.preventDefault();
|
||||
//e.preventDefault();
|
||||
if (isMac() && contextMenuState.state) {
|
||||
//mac有bug
|
||||
return;
|
||||
@@ -111,6 +111,7 @@ export const innerContainerDragUp = function (config: UserConfig, mode = 'normal
|
||||
wrapperMoveMouseUp(config);
|
||||
selectRangeMouseUp(e, config);
|
||||
if (mode !== 'normal') {
|
||||
console.log('ggogogogogogo');
|
||||
}
|
||||
if (innerDragState.ref && innerDragState.ref.current) {
|
||||
innerDragState.ref.current.style.cursor = 'default';
|
||||
|
@@ -18,7 +18,7 @@ export const selectData: SelectDataProps = {
|
||||
startY: 0,
|
||||
};
|
||||
|
||||
export function selectRangeMouseDown(e: React.MouseEvent, config: UserConfig) {
|
||||
export function selectRangeMouseDown(e: React.MouseEvent, config: UserConfig, iframe: boolean) {
|
||||
if (!selectData.selectDiv) {
|
||||
selectData.selectDiv = document.createElement('div');
|
||||
}
|
||||
@@ -32,6 +32,18 @@ export function selectRangeMouseDown(e: React.MouseEvent, config: UserConfig) {
|
||||
selectData.selectDiv.style.top = e.clientY + 'px';
|
||||
selectData.selectDiv.style.position = 'fixed';
|
||||
document.body.appendChild(selectData.selectDiv);
|
||||
if (iframe) {
|
||||
console.log('cxcxc');
|
||||
window.parent.postMessage(
|
||||
{
|
||||
type: 'event',
|
||||
column: 'mousedown',
|
||||
data: null,
|
||||
},
|
||||
'*'
|
||||
);
|
||||
}
|
||||
|
||||
selectData.selectDiv.onmouseup = (e) => selectRangeMouseUp(e, config);
|
||||
selectData.selectDiv.onmousemove = (e) => selectRangeMouseMove(e);
|
||||
}
|
||||
|
@@ -281,10 +281,12 @@ export const changeUserValueRecord = (
|
||||
};
|
||||
|
||||
export function postMessage(value: any, src: string, target = 'yh-container-iframe') {
|
||||
const iframe = document.querySelector(`#${target}`) as HTMLIFrameElement;
|
||||
const search = '#' + target;
|
||||
const iframe = document.querySelector(search) as HTMLIFrameElement;
|
||||
|
||||
if (iframe) {
|
||||
iframe.contentWindow?.postMessage(value, src);
|
||||
} else {
|
||||
console.warn('can not find iframe');
|
||||
console.warn(`can not find iframe ${search}`);
|
||||
}
|
||||
}
|
||||
|
@@ -2,7 +2,7 @@
|
||||
* @Author: yehuozhili
|
||||
* @Date: 2021-03-14 05:35:15
|
||||
* @LastEditors: yehuozhili
|
||||
* @LastEditTime: 2021-07-17 20:59:26
|
||||
* @LastEditTime: 2021-07-19 21:28:23
|
||||
* @FilePath: \dooringx\packages\dooringx-lib\src\hooks\index.ts
|
||||
*/
|
||||
import { useEffect, useMemo, useState } from 'react';
|
||||
@@ -150,3 +150,41 @@ export function useIframePostMessage(
|
||||
|
||||
return [fn];
|
||||
}
|
||||
|
||||
export function useIframeHook(origin: string, config: UserConfig) {
|
||||
const [iframeReady, setIframeReady] = useState(false);
|
||||
const [fnx] = useIframePostMessage(origin, config, iframeReady);
|
||||
useEffect(() => {
|
||||
//@ts-ignore
|
||||
const fn = (e: MessageEvent<any>) => {
|
||||
console.log(e, '收到');
|
||||
if (e.data === 'ready') {
|
||||
setIframeReady(true);
|
||||
fnx();
|
||||
}
|
||||
if (typeof e.data === 'object') {
|
||||
if (e.data.type === 'update') {
|
||||
if (e.data.column === 'scale') {
|
||||
config.scaleState = e.data.data;
|
||||
config.getStore().forceUpdate();
|
||||
config.refreshIframe();
|
||||
}
|
||||
}
|
||||
if (e.data.type === 'event') {
|
||||
if (e.data.column === 'mousedown') {
|
||||
// 发射mousedown
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
const parentMove = () => {
|
||||
console.log('movessss');
|
||||
};
|
||||
window.addEventListener('mousemove', parentMove);
|
||||
window.addEventListener('message', fn);
|
||||
return () => {
|
||||
window.removeEventListener('message', fn);
|
||||
window.removeEventListener('mousemove', parentMove);
|
||||
};
|
||||
}, [config, fnx]);
|
||||
}
|
||||
|
@@ -2,7 +2,7 @@
|
||||
* @Author: yehuozhili
|
||||
* @Date: 2021-03-14 04:22:18
|
||||
* @LastEditors: yehuozhili
|
||||
* @LastEditTime: 2021-07-17 16:38:22
|
||||
* @LastEditTime: 2021-07-19 21:24:13
|
||||
* @FilePath: \dooringx\packages\dooringx-lib\src\index.tsx
|
||||
*/
|
||||
|
||||
@@ -57,4 +57,4 @@ export { specialCoList } from './core/utils/special';
|
||||
// iframe
|
||||
export { default as IframeContainer } from './components/iframeContainer';
|
||||
export { default as IframeContainerWrapper } from './components/IframeWrapperMove';
|
||||
export { useIframePostMessage } from './hooks';
|
||||
export { useIframePostMessage, useIframeHook } from './hooks';
|
||||
|
Reference in New Issue
Block a user