Question

标题类型说明了一切。当它在后台运行一段时间后返回我的React Native应用程序时，指向外部uri的所有（或至少一些）Image元素将变为空白。

认为iOS可能会占用应用程序的内存，我已经尝试让应用程序重新呈现 - 并重新加载这些图像 - 当它变得活跃时：

React.AppStateIOS.addEventListener('change', (newState) => {
    if(newState === "active") {
        this.forceUpdate();
    }
});

虽然它确实重新渲染，但它并没有重新加载图像。

这里发生了什么？

Answer 1

我有同样的问题专门针对GIF。看起来这是一个React Native的错误，如下所示：

https://github.com/facebook/react-native/issues/4606

我修改了存储AppState：

的解决方法

constructor(props) {
  super(props);
  this.state = {
    appState: 'active'
  };
  AppState.addEventListener('change', newState => this.setState({ appState: newState }));
}

然后我只在source为AppState时使用正确的active呈现图片，以便当它进入inactive或background时{ {1}}为空，在移回Image时会被迫重新投降：

active

我使用的实际代码有点不同，因为我使用render() { return <Image source={{ uri: this.state.appState === 'active' ? this.props.imageUrl : '' }} />; }来处理我的应用状态，但这应该是一样的。

从背景返回时，React Native Images消失

1 个答案: