React Native中的最小宽度/高度

Question

如何为React Native组件设置最小宽度或高度？

在css中,我可以使用min-width/min-height

https://facebook.github.io/react-native/docs/flexbox.html#content

react-native docs上没有minWidth/minHeight

Answer 1

从iOS和Android的react-native版本0.29.0开始支持minHeight,maxHeight,minWidth和maxWidth属性.

这是来自react-native文档的maxHeight描述.此描述也适用于其他最小/最大样式属性.

maxHeight是此组件的最大高度,以逻辑像素为单位.

它与CSS中的max-height类似,但在React Native中,您必须使用点或百分比.不支持Ems和其他单位.

有关详细信息,请参阅https://developer.mozilla.org/en-US/docs/Web/CSS/max-height.

一个虚拟的例子:

<View
  style={{
    minWidth: '20%',
    maxWidth: 500,
    minHeight: '10%',
    maxHeight: 150,
  }}
/>