首页 > 解决方案 > React Native:“返回”功能

问题描述

有没有办法在反应导航中禁用“goBack”功能?基本上我有一个页面(示例页面 A),人们在其中进行登录,然后此页面转到另一个页面(示例页面 B)。我想禁用从页面 B 到页面 A 的 goBack。

export default class ChatDisponibili extends Component {
  static navigationOptions = {
    title: "CHAT DISPONIBILI",
    headerStyle: {
      backgroundColor: '#3498db',
    },
    headerTintColor: '#fff',
    headerTitleStyle: {
      fontWeight: 'bold',
    }
  };

  ........................

  render() {
    return (
      <View style={styles.container}>
        <ScrollView>
          <FlatList
            data={this.state.data}
            keyExtractor={(item, index) => index.toString()}
            renderItem={this._renderItem}
          />
        </ScrollView>
        <View style={styles.footer}>
          <Text style={styles.footerTesto}>FOOTER DA CAMBIARE</Text>
        </View>
      </View>
    );
  }
}

标签: react-nativereact-native-androidreact-navigation

解决方案


将标题禁用为“无”只是从页面禁用标题的一种方法。Android 用户仍然可以单击原生返回按钮返回。因此,您还需要禁用本机 android 按钮。

import {  BackHandler } from 'react-native'
componentDidMount() {
        BackHandler.addEventListener('hardwareBackPress', () => {
            return true;
          });

    }

这可以访问您处理 android 后退按钮。有关处理 android 后退按钮的更多信息,请访问:https ://facebook.github.io/react-native/docs/backhandler.html


推荐阅读