3lang3 / react-vant

React mobile UI Components base on Vant
https://react-vant.3lang.dev
MIT License
1.31k stars 186 forks source link

🐛 [Bug]: flex 组件 margin-bottom 设置的是正值 #668

Closed Ha0ran2001 closed 11 months ago

Ha0ran2001 commented 1 year ago

Which React Vant packages are impacted?

What version of React Vant are you using?

v3.3.1

Reproduce live demo(codesandebox or stackblitz)?

No response

Descripition

marginLeft: getGutter[0]! / -2, 
marginRight: getGutter[0]! / -2,
...
marginTop: getGutter[1]! / -2,
marginBottom: getGutter[1]! / 2,

为什么这里 marginBottom 除以 2 而不是 除以 -2 ?我发现 gutter 的逻辑是:比如设置 gutter={4},那么会给每一个元素设置padding-left: 2px; padding-right: 2px; 然后包起来的盒子设置margin-left: -2px; margin-right: -2px; 这是为了消除边上元素的靠边的边距。 但是竖直方向,为什么marginBottom 除以 2?变成了正值,这样会导致下边距进一步扩大而不是消除。应该是写错了吧!