今天完成的一个需求:某个功能会在手机和电脑上使用,所以需要做适配。完成这个功能用的是antd mobile的组件,但是我加需求的时候没注意,直接用了antd design的row和col,没有用antd mobile的Grid、Grid.Item,懒得换了,仔细看了看文档其实col也可以响应式,以前只用过row的gutter。
//row
gutter={[{ xs: 8, sm: 8, md: 16, lg: 24, xl: 32 }, 24]}
//col 屏幕<576px时,span={12} 屏幕屏幕≥992px时,span={6}(也可以写的更细致一点
xs={12} lg={6}
效果如下: 移动端:
PC端:
row和col还是很好用的