Javascript 材料顶杆上方的组件？自然反应

im使用

react navigation/material top bar

在屏幕之间导航，问题是im也使用组件

bottomsheet

当它到达屏幕顶部时，选项卡会覆盖它，有没有办法将底部页面放在选项卡栏上方

代码，以下是应用程序：

render() {
return (
  <>
    <NavigationContainer>
      <Tab_Navigator></Tab_Navigator>
    </NavigationContainer>
  </>
);

render（）{
返回(
);

此处选项卡：
返回(
)
这是一条轨道：
（this.sheetref=ref）}
initialSnap={1}
捕捉点={[Dimensions.get（“window”）.height-StatusBar.currentHeight，95]}
renderHeader={（）=>}
renderContent={（）=>}
EnabledContentTestureInteraction={false}
onOpenEnd={this.hide_icon}
onCloseEnd={this.show_icon}>

heres tab:

    return(
        <Tab.Navigator>
            <Tab.Screen name = "Tracks" component = {Tracks}></Tab.Screen>
            <Tab.Screen name = "Chao" component = {Chao}></Tab.Screen>
        </Tab.Navigator>
    )

and this is Tracks:

     <View style = {{flex: 1, backgroundColor: "black"}}>
                    <BottomSheet
                        ref = {ref => (this.sheetref = ref)}
                        initialSnap = {1}
                        snapPoints = {[Dimensions.get("window").height - StatusBar.currentHeight, 95]}
                        renderHeader = {() => <Player_Header {...props}></Player_Header>}
                        renderContent = {() => <Track_Zone {...props}></Track_Zone>}
                        enabledContentGestureInteraction = {false}
                        onOpenEnd = {this.hide_icon}
                        onCloseEnd = {this.show_icon}>
                    </BottomSheet>
                </View>
            </>