Question

我正在传递道具，并且当滚动特定高度时，我正在传递参数showHeader: "True"，因此当我滚动标题时，标题是不透明的，最初是透明的。因此，在用户滚动回到顶部之后，我希望页眉再次透明，但是不透明，我该如何解决呢？

代码：

Inisde ProjectDetailsScreen组件：

handleScroll = (event) => {
        if(event.nativeEvent.contentOffset.y > 100) {
            console.log("Height is this ", event.nativeEvent.contentOffset.y);
            this.props.navigation.setParams({ showHeader: "True"})
        }
    }

<ScrollView style={styles.container} 
                onScroll={this.handleScroll}
</ScrollView>

navigation.js内部：

ProjectDetails: {
        screen: ProjectDetailsScreen,
        navigationOptions: ({ navigation }) => ({

            headerTransparent: navigation.state.params.showHeader === "True" ? false : true ,

            headerTitle: navigation.state.params.myTitle,
        }),
      }

所以最初的标题是透明的，所以向下滚动后标题是不透明的，但是如果我再次滚动回初始位置，我希望标题是透明的，我该怎么做？

Answer 1

将其设置为false

handleScroll = (event) => {
    if(event.nativeEvent.contentOffset.y > 100) {
        console.log("Height is this ", event.nativeEvent.contentOffset.y);
        this.props.navigation.setParams({ showHeader: "True"})
    }
    else {
        this.props.navigation.setParams({ showHeader: "False"})
    }
}

如何在React Native中隐藏和显示导航栏？

1 个答案: