react-native shadow 阴影问题

本人最近在学习 RN,问题如下： 我创建了一个组件，用于显示一些东西，代码如下 app.js 内容如下

import SideMenu from 'react-native-side-menu'; import CameraList from '../pages/CamList';

export default class App extends Component{

render() { return ( <SideMenu> <CameraList /> </SideMenu> ); } 

}

CamList.js 内容如下

export default class CameraList extends Component {

render() { return ( <ScrollView style={{ padding:8 }} automaticallyAdjustCOntentInsets={false} refreshCOntrol={ <RefreshControl refreshing={false} OnRefresh={this.onRefresh} title="Loading..." colors={['#ffaa66cc', '#ff00ddff', '#ffffbb33', '#ffff4444']} /> } > <View style={styles.bordershadow}> <View style={{height:200, backgroundColor:'red', justifyContent:'flex-end'}}> <Text style={{color:'#fff', fontSize:12}}>aabbcc</Text> </View> </View> </ScrollView> ); } 

}

const styles = StyleSheet.create({ bordershadow:{ shadowOffset:{ width:2, height:2 }, shadowColor:'black', shadowOpacity:0.2, shadowRadius:1, } });

为了凸显问题，我简化了一些不必要的引用 问题来了，我发现 app.js 中，如果我加上 SideMenu 标签，会导致 CamList.js 文件中的所有的元素在显示的时候都有 shadow 的效果 而实际上我只想让最外层的 View 添加 bordershadow css 有 shadow 的阴影效果，而实际上不加 SideMenu 标签，代码运行也没什么问题，我研究了很长时间，没搞明白是什么问题 请各位赐教，哪怕只是一个思路，谢谢！