Question

我是React Native EStyleSheet lib的新手。我发现它真的很酷，但是我不知道要解决的一件事是，如何像以前使用style={{...styles.style1, ...styles.style2}}处理常规样式一样，将多个样式应用于单个元素？

render() {
    return <View style={estyles.container}>
        <View style={{...estyles.container, ...estyles.containerInner}}>
            <Text>Hello, World!</View>
        </View>
    <View>

}

const estyles = EStyleSheet.create({
    container: {
        padding: '2%',
        borderStyle: 'solid',
        borderRadius: 1,
        borderWidth: 1,
        borderColor: 'black'
    },
    containerInner: {
        padding: '5%'
    }
});

Answer 1

您可以在样式的样式数组中使用例如：

render() {
    return <View style={estyles.container}>
        <View style={[estyles.container,estyles.containerInner]}>
            <Text>Hello, World!</View>
        </View>
    <View>

}

const estyles = EStyleSheet.create({
    container: {
        padding: '2%',
        borderStyle: 'solid',
        borderRadius: 1,
        borderWidth: 1,
        borderColor: 'black'
    },
    containerInner: {
        padding: '5%'
    }
});

此=>可以使用[estyles.container，estyles.containerInner]

Answer 2

您可以使用样式数组将多种样式应用于单个视图

示例

<View style={[styles.container, styles.view,...]}>
</View>

React Native EStyleSheet如何应用多种样式

2 个答案: