如何为TextInput添加滚动条？开启multiline仍无效

针对你的代码，只需给TextInput添加几个滚动相关属性就能显示滚动条，分平台说明如下：

直接修改代码 #

在你的TextInput组件中添加以下属性：

<TextInput
  style={styles.input}
  placeholder={selectedCategory ? 'Add' : 'New'}
  multiline={true}
  placeholderTextColor="#979aaa"
  value={description}
  onChangeText={(text) => setDescription(text)}
  // 新增滚动相关属性
  scrollEnabled={true}
  showsVerticalScrollIndicator={true}
  // 可选：调整滚动条与输入框内边距匹配（Android端生效）
  scrollIndicatorInsets={{ top: 10, bottom: 10 }}
/>

不同平台的细节说明 #

• Android端：默认支持滚动，但显式设置scrollEnabled和showsVerticalScrollIndicator可以确保滚动条稳定显示，scrollIndicatorInsets能让滚动条和输入框的padding对齐，视觉更协调。
• iOS端：必须显式开启showsVerticalScrollIndicator={true}才会显示滚动条，同时你的代码已经设置了固定高度height:200，当输入内容高度超过这个值时，就会自动触发滚动。

排查无效情况 #

如果添加后仍无效果，检查这两点：

• 确认父组件没有设置overflow: hidden，否则会遮挡滚动条。
• 确保TextInput的editable属性为true（默认是true，若手动设置为false会禁用滚动）。

内容的提问来源于stack exchange，提问作者Maxim