查看边框阴影而不影响其子项答案

【问题标题】：View border shadow without affect its child查看边框阴影而不影响其子项
【发布时间】：2018-06-05 21:33:52
【问题描述】：

我想在视图的边框上添加阴影。但是，我不希望视图中的所有孩子也受到阴影的影响。我只想要视图边界之外的阴影，而不是视图中的文本或图像。可以这样做吗？

        <View style ={{
            margin:5,
            borderWidth:0.5,
            borderColor:'grey',
            borderRadius:15,
            overflow:'hidden',
            elevation:10,
            height:100}}

            ></View>

【问题讨论】：

标签： css reactjs react-native

【解决方案1】：

你可以用它来做阴影：

view: {
    height : 100,
    width : 100,
    shadowColor: "#000000",
    shadowOpacity: 0.8,
    shadowRadius: 2,
    shadowOffset: {
      height: 1,
      width: 0
    }
  }

我希望这会有所帮助。

【讨论】：

嗨，它不起作用。阴影仍然会影响视图中的文本
好的。那么您可以根据您的要求使用第 3 方吗？ react-native-shadow

【解决方案2】：

我想在视图的边框上添加阴影

您可以将属性 boxShadow 应用于您的 <View> 元素。

例如

boxShadow: '6px 6px 4px rgb(127, 127, 127)',

【讨论】：