ResizableBox 不包装内容

Question

我正在使用 ResizeBox 并想将其中的内容包装起来。但是，它不起作用。代码在此处的沙箱中。我也尝试过使用其他组件（div 除外），同样的问题也发生了。

import React from "react";
import { ResizableBox } from "react-resizable";
import "react-resizable/css/styles.css";
import "./style.css";

const Box = () => {
  return (
    <ResizableBox className="box borderBlack" width={200} height={200} axis="y">
      <div>tXYZ!!</div>
      <div>tXYZ!!</div>
      <div>tXYZ!!</div>
      <div>tXYZ!!</div>
      <div>tXYZ!!</div>
      <div>tXYZ!!</div>
      <div>tXYZ!!</div>
      <div>tXYZ!!</div>
      <div>tXYZ!!</div>
      <div>tXYZ!!</div>
      <div>tXYZ!!</div>
      <div>tXYZ!!</div>
      <div>tXYZ!!</div>
      <div>tXYZ!!</div>
      <div>tXYZ!!</div>
      <div>tXYZ!!</div>
    </ResizableBox>
  );
};

export default Box;

https://codesandbox.io/s/create-react-app-with-typescript-forked-u5dwp?file=/src/App.tsx

Answer 1

.react-resizable {
   overflow-y: auto;
}

ResizableBox 不包装内容

ResizableBox doesn't wrap contents

javascript

word-wrap

reactjs