在离线（无网络）模式下显示 SVG

Question

当没有互联网连接时，我想显示一个 SVG，但问题是 SVG 没有在 离线 模式下加载。 我正在使用 react-detect-offline 库来检测网络（离线/在线）。

有什么方法可以预加载 SVG 或在 javascript 或 React 中以离线模式使用 SVG。

 <Offline>
     <OfflineContainer
         offlineMessage="It looks like you're offline. We'll keep trying to reconnect."
         iconSVG={this.props.iconSVG}
     />
</Offline>

离线消息显示正常，但 SVG 在我离线时不会加载。

P.S- 我将 SVG 作为道具发送到我的离线组件。

Answer 1

使用 service worker 缓存 svg。包含带有预取属性的 svg 以在不需要时加载它。然后，当您的 service worker 运行时，即使没有活动连接，您也可以访问 svg。