reactjs - 通过单击并拖动一个角来调整 Material ui 卡组件的大小

标签 reactjs material-ui resizable react-dnd react-beautiful-dnd

我有一个位于react-beautiful-dnd 列表中的 Material UI 卡列表。我希望能够将卡片从一个列表移动到另一个列表并重新组织它们(这已经完成)。例如,我还希望能够单击卡片的右下角并根据需要调整其大小。那可能吗?如果是这样,怎么办?我尝试过将卡片包装在像react-grid-layout对象一样的东西中,但没有成功,虽然我的 react 应用程序仍然出现,但卡片没有渲染。

预先感谢您的帮助。

最佳答案

我找到了一个简单的解决方案并认为我会分享。我所需要做的就是将每个 Material UI 卡包装在 React-Ressized 的 RessizedBox 中。然后,为了使卡片的尺寸遵循 ResizingBox 的尺寸,我使用 Material UI makeStyles 将 100% 的宽度和高度应用于卡片。就是这样。

关于reactjs - 通过单击并拖动一个角来调整 Material ui 卡组件的大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60458342/

相关文章:

javascript - React Material UI 在等待数据时在表中显示进度

javascript - Jest URL.createObjectURL 不是函数

javascript - 导航到不同路线时清除 redux 状态

javascript - 如何在使用 axios 和 ReactJS 使用react选择后获取数据?

angular - 具 Angular 可拖动和可调整大小的 div

javascript - 如何通过拖动图像来调整 div 大小?

jquery - droppabledraggable在移动时与div重叠

javascript - Reflux 存储不听 Action

reactjs - React MUI 自定义 Autocomplete 的 Popper 组件

reactjs - react - createMuiTheme 和 createTheme 之间的区别