Question

我想检查颜色是否为元素的白色，如下所示，

if(styles.background=='white')
console.log("ok")

console.log(styles.background=='white') --> was false [1]

为什么[1]返回false？

Answer 1

1 - 在你的情况下，样式是一个StyleSheet对象。

您需要使用 StyleSheet.flatten 功能，如下所示：

 const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF'
    },
    welcome: {
        fontSize: 20,
        textAlign: 'center',
        margin: 10,
    },
    instructions: {
        textAlign: 'center',
        color: '#333333',
        marginBottom: 5,
    },
});

var styleObj = StyleSheet.flatten([styles.container])

console.warn(styleObj.backgroundColor==='#F5FCFF') //=>true

2 - 处理组件的样式：

var flattenStyle = require('flattenStyle');
var backgroundColor = flattenStyle(this.props.style).backgroundColor;

此处有更多详情：

https://facebook.github.io/react-native/docs/stylesheet.html

和

https://stackoverflow.com/a/35233409/1979861

Answer 2

只是想确保参数传递语法正确（注意：不需要围绕参数的方括号。）

对于单一表单样式表：

var styleObj = StyleSheet.flatten(styles.container)

对于多表单样式表：

var styleObj = StyleSheet.flatten(styles[1].container)

然后你可以打印它作为dict来检查属性：

console.log(styleObj)

为什么我们不能检查react-native应用程序的样式属性？

2 个答案: