Question

我正在将我的应用程序从反应导航1.5升级到3.0.9。我不清楚组件状态管理有什么区别，但是我确定有一些区别。过去效果不错，现在看来很奇怪。看起来状态以某种方式被缓存，并且浏览并返回到该组件，state.params.letter仍然是相同的，即使我不需要它也是如此。如果我改变看法，国家不应该被破坏吗？

该组件具有非常简单的逻辑，它显示了FlatList个项目。如果存在道具letter，则仅显示以该字母开头的项目。

export default class Search extends Component {
    constructor(props) {
        super(props);
    }
    DB = null;
    componentDidMount(){
        //check for the param "letter"
        let L = this.props.navigation.state.params ? this.props.navigation.state.params.letter : null;
        this.setState({
            DB: L ? this.DB.getStartWith(L) : this.DB.getAll()
        })
    }
    render() {
        const { params } = this.props.navigation.state;
        const { t, i18n, navigation } = this.props;


        return (
            <View>
                <FlatList data={this.state.DB}
                    renderItem=({item}) => <Text> {item} </Text>
                />
            </View>
        );
    }

}

Answer 1

反应导航堆栈导航器的工作方式是存储不同屏幕的堆栈，以便在单击后退按钮时可以知道上次访问的屏幕。当您根据情况传递参数时：

this.props.navigation.state.params.letter

状态将存储在react导航堆栈中，并将一直停留在该位置，直到您“破坏”屏幕为止（例如从该屏幕返回），例如，如果堆栈看起来像（screen1>搜索），然后将其移至screen2，使其变为（screen1>搜索> screen2）搜索组件的内部状态将被破坏，但反应导航状态将不被破坏，因此，如果返回该参数字母将是相同的，销毁该参数的唯一方法是返回到screen1。另一种选择是使用redux 之类的东西来存储您的字母参数，通常，我尽量避免使用react-navigation参数传递变量，除非它是与导航本身相关的参数（例如导航选项）。

StackNavigator与createStackNavigator

1 个答案: