Как я могу добавить функцию скрипта в React - PullRequest
Новая
       14

Как я могу добавить функцию скрипта в React

0 голосов
/ 02 апреля 2019

Я пытаюсь добавить внешнее приложение Chameleon в свое реактивное приложение, и для этого мне нужно добавить функцию javascript в мое приложение.

Я хочу, чтобы он вызывался только в определенных ситуациях, поэтому я не хочу загружать его в мой index.html. Я попытался добавить его к функции render моего компонента как: 

render() {
  return(
    <div>
     <head>
      <script type="text/javascript">/* Chameleon - better user onboarding */!function(t,n,o){var a="chmln",c="setup identify alias track clear set show on off custom help _data".split(" ");n[a]||(n[a]={}),n[a].accountToken=o,n[a].location=n.location.href.toString();for(var e=0;e<c.length;e++)!function(){var t=n[a][c[e]+"_a"]=[];n[a][c[e]]=function(){t.push(arguments)}}();var s=t.createElement("script");s.src="https://fast.trychameleon.com/messo/"+o+"/messo.min.js",s.async=!0,t.head.appendChild(s)}(document,window,"TOKEN");
         chmln.identify(USER.ID_IN_DB, {     // Unique ID of each user in your database (e.g. 23443 or "590b80e5f433ea81b96c9bf6")
            email: USER.EMAIL });
      </script>
      ...
      ...
     </head>
    </div>
  )
}

Но вышесказанное не работает. Я попробовал то же самое в шлеме, но не повезло. Они оба показывают ошибку для 

SyntaxError: Unexpected token

Есть ли способ загрузить эту функцию в определенный компонент или мне нужно сделать это в index.html?

1 Ответ

2 голосов
/ 03 апреля 2019

У вас, похоже, сильное недопонимание того, для чего нужна реакция и как она используется.

1) На странице должен быть только 1 head элемент, и он должен быть в index.html, а не в визуализированном выводе компонента.

2) Наличие компонента рендеринга тега <script> идет вразрез с точкой реакции.

Что вам нужно сделать, это import код, который вам нужен в вашем компоненте:

import './path/to/file.js'

А затем оттуда chmln должен быть доступен для window объекта 

window.chmln.identify()
...