所以我对此感到有点困惑......我在我们的应用程序的一部分中使用了 WebView，WebView 的原因是因为我们从 API 端点中提取，该端点返回给我们一个 HTML 字符串。此 HTML 字符串中的字体大小和其他内容的样式不是为了在移动应用程序中使用而设计的，因此我们正在尝试为其添加一些样式更改以提高可见性。我见过人们在 html 文件的顶部添加样式标签以向元素添加特定的 html 样式，并且一切正常，除了 WebView 的 HTML 中的字体大小在每次单击具有其中包含的 WebView。

这是当前代码（样式 + html + 脚本）：

let rawHTML = htmlStyle + this.props.itemDetails.body_html.replace("\n", "").replace(/("\/\/[c])\w/g, "\"https://cd").replace(/(width: 10.094%;)/g, "").replace(/(width: 84.906%;)/g, "") + heightScript

我还在调试器中控制台记录了这个字符串，以确保它拼接得很好，甚至创建了 index.html 并将确切的字符串粘贴到那里，以确保它在那里正确显示。

这是样式字符串：

let htmlStyle = `<style>
                        #height-calculator {
                          margin: 0;
                          padding: 0;
                        }
                        #height-calculator {
                            position: absolute;
                            top: 0;
                            left: 0;
                            right: 0;
                            margin: 0;
                            padding: 0;
                        }
                        body {
                          width:100%;
                        }
                        h2 {
                          font-size: 48px;
                        }
                        p {
                          font-size: 18px;
                        }
                        h3 {
                          font-size: 32px
                        }
                        img {
                          width:98%;
                        }
                        td {
                          display: block !important;
                          width: 95% !important;
                        }
                        img {
                          width:98%;
                        }
                        hr {
                          width: 98%;
                        }
                        ol li ol li ol li {
                          position: relative; right: 85px;
                        }
                        ul {
                          width: 98%,
                          margin-left: -25px;
                        }
                        li {
                          width: 98%;
                        }
                        .tabs {
                          display: none;
                        }
                        .tabs > li {
                          display: none;
                        }
                        .tabs-content {
                          padding: 0;
                          list-style-type: none;
                        }
                        tr {
                          display: flex;
                          flex-direction: column;
                        }
               </style>`

最后是 WebView：

<WebView
  javaScriptEnabled={true}
  onNavigationStateChange={this.onNavigationStateChange.bind(this)}
  scrollEnabled={false}
  source={{html: rawHTML}}
  style={{height: Number(this.state.height)}}
  domStorageEnabled={true}
  scalesPageToFit={true}
  decelerationRate="normal"
  javaScriptEnabledAndroid={true} />

另外，正如我提到的所有其他应用的样式都在工作，主要是字体大小是超级不可预测的。

这是我单击一次时的视图：

然后我没有更改或退出应用程序，我只是返回，然后单击相同的按钮进入相同的显示，有时我会得到这个（有时需要多次点击......这是非常不可预测的）：

我也有一个关于这个的视频，如果你觉得这会有助于这个解释。我正在尽力复述它，哈哈。

编辑：

我认为这可能是仅与模拟器相关的问题？如果有人能说出一些智慧，那仍然很棒。我似乎无法在生产版本中重现此错误。