将动态变量注入 React Native 的 WebView 的注入 JavaScript 字符串答案

【问题标题】：Inject dynamic vars into React Native's WebView's injectedJavaScript string将动态变量注入 React Native 的 WebView 的注入 JavaScript 字符串
【发布时间】：2016-09-16 06:48:10
【问题描述】：

我正在我的应用中加载这个 WebView：

           <WebView
                style={{
                    marginTop: 5,
                    flex:1,
                    flexDirection: 'column',
                    alignItems:'center',
                    justifyContent: 'center',
                    backgroundColor: 'rgba(255,255,255,0.8)',
                    height:300
                  }}
                source={require('./test.html')}
                injectedJavaScript={injectedScript}
                scalesPageToFit={true}
            />

因为我希望这个 html 文件显示一个我在调用渲染之前得到的字符串 - 我想做以下事情：

        let injectedScript = `CKEDITOR.instances.editor.setData(${bodyForDisplay});`;

但这只是行不通。当我用静态字符串（即“test”）替换 ${bodyForDisplay} 时 - 它可以完美运行。

关于如何在这里注入动态值有什么想法吗？

【问题讨论】：

标签： javascript webview uiwebview react-native

【解决方案1】：

您需要用单引号或双引号将${bodyForDisplay} 括起来，因为它是方法setData 的字符串参数。

另外，请确保在 bodyForDisplay 中转义字符串，这样它就不会关闭开头的字符串引号（单引号或双引号）。信任用户输入永远不会安全，因此您也应该正确转义该字符串中的其他字符。

【讨论】：