react native: view not shows in android

Question

我有一个包含组件的标头。这个标题在安卓和iOS中应该有阴影。它可以在iOS上运行，但在Android中不显示任何内容。

class Toolbar extends Component {
  render() {
    return (
      <View style={[styles.toolBar, this.props.style]}>
        {this.props.children}
      </View>
    );
  }
}
const styles = StyleSheet.create({
  toolBar: {
    zIndex: 1,
    flex: 1,
    flexDirection: 'row',
    justifyContent: 'space-between',
    height: topBarHeight,
    backgroundColor: colors.base,
    elevation: 5,
    shadowOpacity: 0.3,
    shadowRadius: 1,
    shadowOffset: {
      height: 2,
      width: 0
    }
  }
});

Answer 1

如文档中所述，影子道具（shadowColor、shadowOffset、shadowOpacity和shadowRadius）只能在iOS中使用。

Answer 2

如果您执行未显示的视图，则不应在一种样式中使用 zIndex 和 elevation。 对于 android，将 zIndex 设置为零。

zIndex: (Platform.OS == 'ios') ? 1 : 0