Nav*_*een 6 textinput react-native react-native-textinput
我正在尝试在 react native 中实现多行文本输入,但是当用户键入时,文本不会被换行,而是在同一行上水平书写,
我的文本输入的代码如下
<View style={[styles.container, props.containerStyles]}>
<TextInput
style={styles.placeholderStyle}
placeholder={"Placeholder text"}
value={this.state.reviewBody}
onChangeText={body => this.setState({ reviewBody: body })}
numberOfLines={5}
textAlignVertical={"top"}
textBreakStrategy={"highQuality"}
underlineColorAndroid={"transparent"}
autoCorrect
/>
</View>
Run Code Online (Sandbox Code Playgroud)
风格是,
const styles = StyleSheet.create({
container: {
flex: 1,
borderWidth: 2,
borderColor: "#f4f4f4",
width: WIDTH - 40,
maxWidth: WIDTH - 40,
minWidth: WIDTH - 40,
alignItems: "center",
justifyContent: "space-between",
paddingHorizontal: 5,
marginTop: 10,
flexWrap: "wrap",
},
placeholderStyle: {
fontSize: 11,
padding: 0,
flex: 1,
width: WIDTH - 40,
maxWidth: WIDTH - 40,
minWidth: WIDTH - 40,
flexWrap: "wrap",
overflow: "scroll"
},
Run Code Online (Sandbox Code Playgroud)
Ank*_*dar 13
在TextInput
组件中,使用 props multiline={true}
,这应该可以解决您的问题。另外,如果你想控制文本对齐行为,你可以使用textAlignVertical
props。在此链接中查找更多详细信息 - https://facebook.github.io/react-native/docs/textinput#multiline
归档时间: |
|
查看次数: |
9125 次 |
最近记录: |