我是否误解了 React Native 的 TextInput 多行和行数属性？

Question

我正在尝试创建一个高度为4行文本的TextInput，如果有5行或5行以上的文本，它不会超过这个高度，而是可以滚动。我以为像这样使用TextInput的多行和numberOfLines属性会起作用，但遗憾的是，当我到达第5行时，textBox会变得更大。

<TextInput
placeholder="Take note of anything contributing to your mood"
maxLength={250}
multiline={true}
numberOfLines={4}
/>

Answer 1

您可以为TextInput样式指定lineHeight和maxHeight属性即maxHeight应与lineHeight、成比例

如果lineHeight是20，如果您想将文本框限制为4行，则maxHeight应该是100

import React from "react";
import { SafeAreaView, StyleSheet, TextInput } from "react-native";
const UselessTextInput = () => {
const [text, onChangeText] = React.useState("Useless");
return (
<SafeAreaView>
<TextInput
style={styles.input}
onChangeText={onChangeText}
value={text}
multiline={true}
/>
</SafeAreaView>
);
};
const styles = StyleSheet.create({
input: {
maxHeight: 100,
margin: 12,
borderWidth: 1,
lineHeight: 20,
},
});