tiptap: fix resize container size

This commit is contained in:
fantasticit 2022-04-26 19:14:01 +08:00
parent 2e6a013203
commit c5462efcb4
3 changed files with 6 additions and 5 deletions

View File

@ -17,6 +17,7 @@
.innerWrap {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
border-radius: var(--border-radius);
flex: 1;

View File

@ -29,7 +29,7 @@ export const IframeWrapper = ({ editor, node, updateAttributes }) => {
)}
</NodeViewContent>
),
[url]
[url, width, height]
);
if (!isEditable && !url) {
@ -39,8 +39,8 @@ export const IframeWrapper = ({ editor, node, updateAttributes }) => {
return (
<NodeViewWrapper>
{isEditable ? (
<Resizeable height={height} width={width} onChange={onResize}>
{content}
<Resizeable height={height} width={width} onChangeEnd={onResize}>
<div style={{ width, height, maxWidth: '100%' }}>{content}</div>
</Resizeable>
) : (
<div style={{ width, height, maxWidth: '100%' }}>{content}</div>

View File

@ -80,7 +80,7 @@ export const ImageWrapper = ({ editor, node, updateAttributes }) => {
if (isEditable) {
return (
<Resizeable className={cls('render-wrapper')} width={width} height={height} onChange={onResize}>
<Resizeable className={cls('render-wrapper')} width={width} height={height} onChangeEnd={onResize}>
{img}
</Resizeable>
);
@ -91,7 +91,7 @@ export const ImageWrapper = ({ editor, node, updateAttributes }) => {
{img}
</div>
);
}, [error, src, isEditable]);
}, [error, src, isEditable, width, height]);
return (
<NodeViewWrapper as="div" style={{ textAlign, fontSize: 0, maxWidth: '100%' }}>