从重构反应原生样式中得到奇怪的错误

Question

我遇到了一个奇怪的错误，简单地从内联复制和粘贴样式到 StyleSheet.create 方法以进行清理是没有任何意义的。它说“bottomBorderStyle”不是有效的样式属性。它在内联时起作用，所以这没有意义。如果我使用内联样式但还保留 StyleSheet，错误甚至仍然存在，然后如果我删除 StyleSheet，错误就会消失。

我已经尝试了我能想到的一切，以确保我没有对语法做任何愚蠢的事情，因为我对本机反应非常陌生，我只是想不出这个错误有意义的方法。当然，我可以保留有效的内联样式，但我真的很想了解为什么会发生这种情况以及我可能做错了什么。我在下面显示的点之间遗漏了一些代码。如果它是相关的，我可以发布其余的。 更新：如果我从边框属性中删除“底部”部分，错误也会消失..

render() {
     return(
           <View style={{alignItems: 'center'}}>
                <View style={{
                                     backgroundColor: 'white',
                                     borderBottomWidth: 1,
                                     borderBottomStyle: 'dashed',
                                     borderBottomRadius: 10,
                                     width: '90%',
                                     alignItems: 'center',
                                     flexDirection: 'row',
                                     justifyContent: 'flex-start'
                                 }}>
               </View>
        );
    }
}
//Error goes away if I delete from here down
const styles = StyleSheet.create( {
    FlexContainer: {
        backgroundColor: 'white',
        borderBottomWidth: 1,
        borderBottomStyle: 'dashed',
        borderBottomRadius: 10,
        width: '90%',
        alignItems: 'center',
        flexDirection: 'row',
        justifyContent: 'flex-start'
    },
});

Answer 1

如下使用样式

<View style={styles.FlexContainer}></View>