如何设置随着用户输入长度的增长而动态增长的 TextInput 字段的初始高度（React Native）

Question

我在解决 React Native 中的 TextInput 字段问题时遇到困难。在我的表单的这一部分中，用户可能会输入很长的内容。因此，我希望 TextInput 框的大小动态增长并保持一致的填充。我已经解决了这个问题，但是，我想知道如何设置此框的初始高度，以仍然允许此多行动态功能持续存在。现在，当我尝试添加初始高度时，它删除了动态填充和多行功能。

这就是我的意思

我尝试过添加初始高度，并且我尝试过添加 minHeight。

当我使用 69 的高度时，它看起来不错，直到用户输入超过该高度。然后，边框和 textInput 之间的 8px 初始填充消失。

我尝试添加一个 minHeight，但这似乎给了它一个巨大的初始值。

Answer 1

像这样尝试一下，专注于

height: Math.max(35, height)

和

onContentSizeChange

const [height, setHeight] = useState(0);
const onContentSizeChange = event =>
            setHeight(Math.max(35, event.nativeEvent.contentSize.height));
   
(
<TextInput
  value={feedback}
  editable
  multiline
  numberOfLines={10}
  placeholder={'Write here...'}
  onChangeText={onTextChanged}
  onContentSizeChange={onContentSizeChange}
  style={{...styles.textInput, height: Math.max(35, height)}}
/>
)