呈现其他组件React导航时无法更新组件

rm5edbpk  于 2023-02-25  发布在  React
关注(0)|答案(1)|浏览(132)

我正在使用expo和react native构建一个应用程序。在我的项目中,我有一个stackNavigator,包含三个stackScreen,还有一个DatabaseManager类,具有静态异步函数。在我的组件中,我使用useState和useEffect加载数据并显示它们。当我从第一个Screen移动到第二个Screen时,我收到一个错误:
警告:无法在呈现其他组件(%s)时更新组件(%s)。若要在%s内找到错误的setState()调用,请按照https://reactjs.org/link/setstate-in-render%s,StackNavigator,Screen,Screen中所述的堆栈跟踪进行操作。
这个警告是,我想这就是为什么我有时需要在屏幕上点击2次才能在屏幕之间导航的原因。
下面是我的代码的一部分:

export default class DatabaseManager {
    ...
    static async getSplits(){
        if (!this.db)
            await this.openDatabase();
        const query = "select distinct day from exercises";
        const resultQuery = await this.executeSql(query, []);
        const result = [];
        var rows = resultQuery.rows;
        for (let i = 0; i < rows.length; i++) {
            var item = rows.item(i);
            result.push({split: item.DAY});
        }
        return result;

    }

    static async getExercises( split){
        if (!this.db)
            await this.openDatabase();
        const query = "select distinct name from exercises where day = ? order by number";
        const resultQuery = await this.executeSql(query, [split]);
        const result = [];
        var rows = resultQuery.rows;
        for (let i = 0; i < rows.length; i++) {
            var item = rows.item(i);
            result.push({name: item.NAME});
        }
        return result    
   }

}

App.js
x一个一个一个一个x一个一个二个x
第二个屏幕与此类似。
我尝试使用useFocusEffectenableFreezeuseFocus。我还尝试在导航到新屏幕之前放置一个加载屏幕,但没有解决这个问题。通过使用一些console.log,我发现我的代码似乎是正确的,导航到其他组件后,主组件没有重新呈现。

yeotifhr

yeotifhr1#

我找到了解决办法:我只是在第二个屏幕中遇到了一个糟糕的navigation.setOptions()...我把它 Package 在useEffect()中,它工作得很好。
我在那里找到了解决办法:https://github.com/react-navigation/react-navigation/issues/9478#issuecomment-813031134

相关问题