javascript - 在离线(无网络)模式下显示 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 作为 Prop 发送到我的离线组件。

Answer 1

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