在 React Native WebView 中添加自定義 html 標簽

Question

我目前正在 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>

是否可以在 React Native Webview 中以編程方式添加？

Answer 1

我在這里找到了答案：使用了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>
  );
};