material-ui 根据断点设置道具的最佳实践

ylamdve6 于 2022-10-29 发布在其他

关注(0)|答案(1)|浏览(177)

在https://github.com/mui-org/material-ui/discussions/29318中讨论

引用自mwskwong2021年10月27日
例如，我想显示一个Button，并在移动的设备上显示时设置fullWidth={true}（即smDown），否则设置false。我可以想到两种实现方式。
1.使用useMediaQuery。优点是代码会更优雅，但问题是它不能很好地与SSR一起工作。在某些情况下，您会注意到布局的变化。
1.挂载两个Button，一个fullWidth设置为true，另一个设置为false，然后根据断点设置CSS属性display。优点是它很好地支持SSR。缺点是你必须复制组件，这对性能和SEO来说不是很好。
现在的问题是，你更喜欢哪一种？或者有没有更好的方法来实现这一点？