Ios 在react native上使用文本自动换行

Ios 在react native上使用文本自动换行,ios,text,react-native,Ios,Text,React Native,我实际上是想用react native写一篇长文章。 我尝试过属性numberOfLines和lineBreakMode,但都不起作用,行永远不会断开,文本一直在一行上,直到屏幕外 这是我的代码: 类后列表 class PostList extends Component { render() { return ( <View style={{flex: 6, justifyContent: 'center', alignItems: 'c

我实际上是想用react native写一篇长文章。 我尝试过属性numberOfLines和lineBreakMode,但都不起作用,行永远不会断开,文本一直在一行上,直到屏幕外

这是我的代码:

类后列表

class PostList extends Component {

    render() {
        return (
            <View style={{flex: 6, justifyContent: 'center', alignItems: 'center'}}>
                <ScrollView>
                    <Post content={'Populo invidunt maluisset sea cu, volumus fierent id sea. Est et clita lucilius tacimates. Sed brute definitionem an. Sed tollit vocibus maiestatis ne, hinc iisque feugiat an vis. Cibo recteque duo an. Ei ludus nusquam vel.'} />
                </ScrollView>
            </View>
        )
    }
}
类PostList扩展组件{
render(){
返回(
)
}
}
班岗

const {height, width} = Dimensions.get('window')

class Post extends Component {

    render(){
        return (
        <View style={styles.container}>
            <View style={styles.textContainer}>
                <Text width={(width * 0.85) - 20} textAlign={'left'} style={styles.contentText}>
                    {this.props.content}</Text>
            </View>
        </View>
        )
    }

}

const styles = StyleSheet.create({
    container: {
        margin: 15,
        width: width * 0.85,
        height: 300, 
        backgroundColor: 'white', 
        borderRadius: 10,
        borderColor: 'rgba(255, 139, 23, 0.7)',
        borderWidth: 1,
        marginTop: 20
    },
    textContainer: {
        flexDirection: 'row',
        marginLeft: 10,
        marginTop: 10
    },
    nameText: {
        fontFamily: 'Aller-bold',
        fontSize: width / 26
    },
    contentText: {
        fontFamily: 'Aller',
        fontSize: width / 26
    }
})
const{height,width}=Dimensions.get('window'))
类Post扩展组件{
render(){
返回(
{this.props.content}
)
}
}
const styles=StyleSheet.create({
容器:{
差额:15,
宽度:宽度*0.85,
身高:300,
背景颜色:“白色”,
边界半径:10,
边框颜色:“rgba(255、139、23、0.7)”,
边框宽度:1,
玛金托普:20
},
文本容器:{
flexDirection:'行',
边缘左:10,
玛金托普:10
},
名称文本:{
fontFamily:“Aller bold”,
字体大小:宽度/26
},
内容文本:{
Fontaller家族:“Aller”,
字体大小:宽度/26
}
})
结果:

那么,当一个单词到达视图的末尾时,我该如何处理换行呢


Thank's

我找到了解决方案:如果您只想在包含文本的容器中添加flexDirection:“行”: