当我尝试在Text元素上使用'textAlignVertical'样式时,出现了“textAlignVertical”不是有效的样式属性的错误。我已经查看了文档,它说我应该能够使用这个样式属性:https://facebook.github.io/react-native/docs/text.html
其他人有遇到这个问题吗?
当我尝试在Text元素上使用'textAlignVertical'样式时,出现了“textAlignVertical”不是有效的样式属性的错误。我已经查看了文档,它说我应该能够使用这个样式属性:https://facebook.github.io/react-native/docs/text.html
其他人有遇到这个问题吗?
0.50.3
,但是 textAlignVertical
不起作用。 - technerd为了让 textAlignVertical
正常工作,iOS系统中应该添加 lineHeight 属性而不是 height 属性
height: phoneWidth * 0.09, // for android
lineHeight: phoneWidth * 0.09, // for ios
textAlignVertical只适用于安卓,对于iOS,请使用multiline
<TextInput
height={32}
textAlignVertical='top' // for android
multiline // for ios
/>
行高解决方案对我很有用。我写这篇文章是为了明确展示如何按平台设置行高:
yourComponent: {
width: 44, height: 44,
...Platform.select({
ios: {
lineHeight: 44
},
android: {}
}),
textAlign: 'center', textAlignVertical: 'center',
}
你的高度和行高相同,并且通过平台实现是很重要的。
需要注意的是,我还将此组件嵌套在 alignItems 设置为 center 的视图中。
我只是想明确地编写这段代码,因为我不得不从几篇文章中拼凑起来,如果有人正在寻找快速复制/粘贴解决方案,这应该会更容易。
textAlignVertical: 'top'
(适用于Android)
alignSelf: 'flex-start'
(适用于iOS)
因此,如果您正在为Android和iOS构建应用程序,请同时提供这两个属性。
例如:
style={{textAlignVertical: 'top', alignSelf: 'flex-start'}}
alignItems: 'center'
应用于您想要垂直居中的子元素的父元素。 - Ivan Chernykh