ant-design Drawer组件宽度如何响应式

Question

我正在使用 ant design 抽屉组件和样式组件。看来我可以使用 width 道具设置固定宽度。但我无法让它响应。

<Drawer
   width={500}
   placement="right"
   closable={true}
   onClose={this.props.handleDrawer}
   visible={this.props.visible}
>

Answer 1

就我而言，这一行将是最简单的解决方案：

width={window.innerWidth > 900 ? 800 : window.innerWidth - 100}

Answer 2

实际的解决方案是使用表达式。

喜欢const isMobile = true //do a match on something there

并使用该表达式来呈现条件百分比，因为属性只是 javascript，您可以执行类似的操作。

width={isMobile ? "80%" : "40%"}