javascript - 在反应原生 WebView 中添加自定义 html 标签
问题描述
我目前正在 Webview 中呈现 HTML 内容。该 HTML 内容托管在云中并使用 html 链接加载到 Webview 中。在这里,我需要在动态呈现时在该内容中添加以下复选框标签,或者我需要在页面底部显示复选框。
<div>
<input type="checkbox" id="agreement_id" name="agreement" value="agreement">
<label for="other">I have read and accept the Electronic Communications Agreement consenting to the use of Electronic Records in connection with opening my new deposit credit accounts requested through the Swell mobile app.</label>
</div>
是否可以在反应原生 Webview 中以编程方式添加?
解决方案
我在这里找到了答案: Used injectedJavaScript
。
const scripts1 = document.write(
'<div> <input type="checkbox" id="agreement_id" name="agreement" value="agreement"> <label for="other">content</label> </div>',
);
const webviewContent = () => {
return (
<View
style={{
height: windowHeight - heightBottom * 1.5,
marginLeft: 10,
marginRight: 10,
}}>
<WebView
style={{backgroundColor: colors.primaryBackgroundColor}}
originWhitelist={['*']}
source={{
uri: 'https://www.google.com',
}}
injectedJavaScript={scripts1}
/>
</View>
);
};
推荐阅读
- jquery - 未捕获的引用错误,$ 未定义。如何解决?
- microsoft-graph-api - Microsoft Graph:无法按二进制 singleValueExtendedProperty 过滤
- reactjs - 在 Chrome Devtools for React 组件中没有指向源代码的链接
- html - 不使用列表的下拉菜单
- batch-file - 我想将命令的结果保存为窗口批处理中的变量
- apostrophe-cms - html上可编辑的片段(字符串)标题
- wpf - 键入时文本框没有 KeyboardFocus,因此 KeyBindings 不起作用
- laravel - 在获取请求时,为什么我应该取回刀片视图,而我应该从数据库中获取数据?
- assembly - 试图在 0x00000000000a0000 处执行 RAM 或 ROM 之外的代码
- react-native - 带有 PersistGate 的启动画面