将卡片组件制作为抽屉式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.

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

SandBox link: https://codesandbox.io/s/musing-leaf-0jj6p?file=/index.js

图片链接: https://www.awesomescreenshot.com/image/4897738/d3c8150967f9b7ee17c8881562727b95

谢谢.

推荐答案

您可以使用这样的自定义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屋！