Add external Javascript (not jsx) to React Native?

Question

New React Native user here. I'm trying to add the below Transliterate JS Code from a website to React Native.

<script type="text/javascript" src="https://www.google.com/jsapi">
</script>
<script type="text/javascript">

  // Load the Google Transliterate API
  google.load("elements", "1", {
        packages: "transliteration"
      });

  function onLoad() {
    var options = {
        sourceLanguage:
            google.elements.transliteration.LanguageCode.ENGLISH,
        destinationLanguage:
            [google.elements.transliteration.LanguageCode.CHINESE],
        shortcutKey: 'ctrl+g',
        transliterationEnabled: true
    };

    // Create an instance on TransliterationControl with the required
    // options.
    var control =
        new google.elements.transliteration.TransliterationControl(options);

    // Enable transliteration in the textbox with id
    // 'transliterateTextarea'.
    control.makeTransliteratable(['transliterateTextarea']);
  }
  google.setOnLoadCallback(onLoad);
</script>

Below is the HTML code for the script.

<body>
Type in Chinese (Press Ctrl+g to toggle between English and Chinese)<br>
<textarea id="transliterateTextarea" style="width:600px;height:200px"> 
</textarea>
</body>

How can I add use this code in React Native? Been struggling with this for weeks. Thank you!

Answer 1

I would make a Higher Order Component (HOC) that wraps an element with the transliteration. You would use the library that Robbie refers to in the comment to your original question.

Add external Javascript (not jsx) to React Native?

Question

1 answers

solution1
0 2018-08-15 19:36:55

Add external Javascript (not jsx) to React Native?

Question

1 answers

solution1 0 2018-08-15 19:36:55

solution1
0 2018-08-15 19:36:55