V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
simonlify
V2EX  ›  React

react-native shadow 阴影问题

  •  1
     
  •   simonlify · 2017-02-14 21:30:55 +08:00 · 11296 次点击
    这是一个创建于 2837 天前的主题,其中的信息可能已经有所发展或是发生改变。

    本人最近在学习 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 标签,代码运行也没什么问题,我研究了很长时间,没搞明白是什么问题 请各位赐教,哪怕只是一个思路,谢谢!

    第 1 条附言  ·  2017-02-15 14:29:54 +08:00
    此问题在无意中解决了。
    在 ScrollView 标签中加一个背景色貌似就可以解决问题了。
    目前尚无回复
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5314 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 01:28 · PVG 09:28 · LAX 17:28 · JFK 20:28
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.