react-native - 如何在不影响内部 View 元素的情况下应用阴影来 react 原生 View ？

Question

我想知道如何仅将阴影应用于主外部 View 。在这里应用阴影，它被应用到所有内部元素

Answer 1

使父元素的阴影 Prop 不继承到子元素的技巧是为设置阴影的组件设置背景颜色。例如，这将是:

<View 
  style={{ backgroundColor: '#fff' }}
  shadowOffset={{height: 10}}
  shadowColor='black'
  shadowOpacity={0.5}
>
  <Text>{title}</Text>
</View>

不幸的是，这只适用于彩色背景——当使用 RGBA 或“透明”设置透明背景时无济于事。