React Native-运行并应用“ setInterval”后，应用程序崩溃

Question

我在这里问的是我一天无法解决的问题。

应用 setInterval 后，我的应用在物理Android手机上崩溃，并且在我的模拟器中显示了一个我不熟悉的错误。

在物理Android手机和仿真器中，我登录应用程序并在特定页面/屏幕上保持一分钟后，它将崩溃或显示错误。

这是我的代码

export default class tables extends Component {
    constructor(props){
        super(props)
        this.state = {
            data: [],
            ....
        }
    }
    fetchData = async () => {
        const response = await fetch('http://192.168.254.***:****/table');
        const json = await response.json();
        this.setState({ data: json });
    }

    componentDidMount = () => {
        this.Set_int = setInterval(() => {
            this.fetchData().then(() => {
                this.setState({ isLoading: false })
            });
        }, 5000);
    }

    componentWillUnmount = () => {
        clearInterval(this.Set_int);
    }

    render() {
        return (
            <View>
                 ....
                 .......
            </View>
        )
    }
}

这是错误：

我的console.log：

Answer 1

服务器日志中的

2693896可能是指响应长度，并且解析到一个对象的2.6 Mb JSON响应会占用大量RAM。不管先前的请求是否完成，每5秒都会请求一次数据。如果客户端或服务器无法以这种速度处理数据，则请求和状态更新将累积并占用所有可用RAM。

setInterval不应通常与promise一起使用，因为它会忽略promise链。

为了改善这种情况，应该仅在状态更新完成时安排新的间隔，或者在保留5s间隔的情况下，可以使用abortable fetch取消请求。