在CodeSandBox中，根据我的测试，拖动和调整大小的事件同时触发。您可以使用react-draggable的cancel属性，以便在调整大小手柄是正在交互的组件时不会发生拖动。

<Draggable
  cancel={".react-resizable-handle"}
    ...

当你这样做时，draggable元素在调整大小时将不再更新它的CSS transform: translate属性-为此，你可以选择控制你的Draggable组件的位置。根据需要平移/设置X和Y，以在调整大小时保持其位置。请注意，x和y状态和状态设置器应该驻留在这些组件中的公共父/祖先上，您将作为props向下传递。

export default function App() {
  // have the source of truth for the positions on a common parent/ancestor
  const [x, setX] = React.useState(0);
  const [y, setY] = React.useState(0);

  return (
    <div className="App">
      <PDFDialog x={x} y={y} setX={setX} setY={setY} />
    </div>
  );
}

...

class PDFDialog extends React.Component {
  state = {
    open: true
  };

  render() {
    const { open } = this.state;
    const { classes } = this.props;

    return (
      <StyledDialog
        open={open}
        classes={{ root: classes.dialog, paper: classes.paper }}
        PaperComponent={PaperComponent}
        aria-labelledby="draggable-dialog"
        PaperProps={{
          x: this.props.x,
          y: this.props.y,
          setX: this.props.setX,
          setY: this.props.setY
        }}
      >
        <ResizableBox
          height={520}
          width={370}
          minConstraints={[300, 500]}
          maxConstraints={[Infinity, Infinity]}
          className={classes.resizable}
          onResize={(e) => {
            if (e.movementX !== 0) {
              this.props.setX((prev) => prev + e.movementX);
            } else if (e.movementY !== 0) {
              this.props.setY((prev) => prev + e.movementY / 2);
            }
          }}
        ></ResizableBox>

        ...

// refactored draggable component:
<Draggable
  position={{ x: x, y: y }}
  cancel={".react-resizable-handle"} // <-- cancel the dragging if resize is interacted with
  onDrag={(e) => {
    if (e.movementX !== 0) {
      setX((prev) => prev + e.movementX);
    }
    if (e.movementY !== 0) {
      setY((prev) => prev + e.movementY);
    }
  }}
>
  <Paper {...props} />
</Draggable>

(On我的CodeSandBox，我已经摆脱了最小height和width等约束，以清楚地显示示例）

你可以绑定窗口调整大小的事件，计算新的高度和宽度，并将其传递给你的resizable-box

object.addEventListener("resize", function() {
//Here you can write logic to apply resizing on the resizable-box
});

显然，react-resizable使用内联CSS来处理一个盒子的 width 和 height，对于你的问题，我模拟了这个问题，注意下面来自Google chrome devTools的截图：

react-resizable-box有一个 important 标志，它覆盖了内联高度值，所以在视图中，我有以下行为：

你的信息是不够的，所以我不能直接说你的问题的原因或原因，但它是非常可能的CSS覆盖是这个问题的根本原因。
因此，检查项目上的resizable-box并寻找CSS覆盖。

添加后更新重现问题

实际上，根据我的最后一个答案，现在在复制沙箱中覆盖了你的height，我删除了iframe标签，一切正常，你传递了一个height="100%"属性给你的iframe标签，它阻止了高度的变化。此外，您将minConstraints={[300, 500]}传递给ResizableBox组件，因此它的高度不能小于500px。