如何更改react-native webview的font-family来自资产的font-family.ttf

如何解决如何更改react-native webview的font-family来自资产的font-family.ttf

我正在使用react-native webview在我的网站上显示一些网络内容 react-native应用。我的应用font-family和webview font-family是不同的。 我想从应用程序更改webview font-family。

是否有任何方法可以更改font-family（自定义字体-资产目录）中的webview，请帮帮我。.谢谢

解决方法

您可以通过将Java脚本注入到Web视图中来实现这一目标

即

将以下代码注入Web视图，这将更改正文标签fontFamily

const INJECTED_JAVASCRIPT = `(function() {
   let body = document.getElementsByTagName("BODY")[0];
  body.style.fontFamily = "Courier New";
})();`;

Web View组件

<WebView
        source={{ uri: 'https://reactnative.dev' }}
        onLoadEnd={()=>console.log('Successfuly Loaded')}
        injectedJavaScript={INJECTED_JAVASCRIPT}
        onError={syntheticEvent => {
          const { nativeEvent } = syntheticEvent;
          console.warn('WebView error: ',nativeEvent);
        }}
      />

工作示例Link