制作卡片组件作为抽屉 Ant Design [英] Make a card component as drawer Ant Design

问题描述

我需要一点帮助.

我正在使用 Ant Design 抽屉，我想要一个特定的卡片组件作为屏幕边缘的幻灯片.我已经对此进行了搜索，但没有得到任何解决方案.请检查沙箱，左侧的卡片应从左侧滑动.请帮帮我.附上一张图片以便更好地理解.

I am using Ant Design drawer, I want a particular card component as slides from the edge of the screen. I have searched regarding this But didn't get any solution. Please check the Sandbox and in that the card which is in left should slide from left. Please help me out. An image is attached for better understanding purposes.

沙盒链接:https://codesandbox.io/s/musing-leaf-0jj6p?file=/index.js

图片链接:https://www.awesomescreenshot.com/image/48993787288287278c88c878c88c88c878c88c88887877375c88885c888c888c888c88c88c8887877737878787738c8815​​62727b97f9b7ee17c8881562727b95

谢谢.

推荐答案

你可以像这样使用自定义 css .

you can do with custom css like this .

在你的反应代码中这样做.

in your react code do like this .

 <Drawer
      className="drawer-height"
        placement="left"
        width={250}
        closable={false}
        onClose={onClose}
        visible={visible}
      >

并将其添加到您的 css 文件中.

and add this in your css file .

.drawer-height {
  height  : 200px;
}

希望这会有所帮助！

这篇关于制作卡片组件作为抽屉 Ant Design的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！