带有文本的自动换行反应原生

时间:2016-07-30 10:06:27

标签: ios text react-native

我实际上是想用一个反复原生的长文本。 我尝试过使用属性numberOfLines和lineBreakMode,但没有任何效果,行永远不会中断,文本会一直在屏幕上,直到屏幕外。

这是我的代码:

类PostList

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>
        )
    }
}

课程帖子

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
    }
})

结果:

http://www.yagoshack.fr/?v=capturmum.png

那么,每当一个单词到达视图结尾时,我该如何处理换行?

感谢&#39; S

0 个答案:

没有答案