Как исправить пустой экран React.js для iOS? - PullRequest
0 голосов
/ 12 октября 2018

Все мои приложения React.js отлично работают во всех протестированных мной настольных браузерах (chrome, edge, IE, firefox).Однако, когда я пытаюсь открыть их на своем iphone, либо в Chrome, либо в Safari, у меня появляется пустой экран.

Ниже приведен пример приложения, которое работает на рабочем столе, но на iOS выглядит пустым.

<html>
  <head>
    <meta charset="utf-8">

    <title>react test</title>

    <script src="js/jquery.min.js"></script>
    <script src="js/react.js"></script>
    <script src="js/react-dom.js"></script>

    <script>
      var h = React.createElement;

      $(document).ready(() => {
        ReactDOM.render(h('h1', null, 'Hello World!'), document.getElementById('app'));
      });
    </script>
  </head>
  <body>
    <div id="app"></div>
  </body>
</html>

Какое решение для этого?

Ответы [ 2 ]

0 голосов
/ 13 октября 2018

Я решил эту проблему с большим количеством экспериментов.

Версия safari на моем iphone не поддерживала функции стрелок ES6, которые я использовал в своем коде.

Замена всех функций стрелок наfunction () {} исправил проблему.

0 голосов
/ 12 октября 2018

Вы всегда должны помещать свой скрипт в конец документа, как это

<html>
  <head>
    <meta charset="utf-8">

    <title>react test</title>
  </head>
  <body>
    <div id="app"></div>


    <script src="js/jquery.min.js"></script>
    <script src="js/react.js"></script>
    <script src="js/react-dom.js"></script>

    <script>
      var h = React.createElement;

      $(document).ready(() => {
        ReactDOM.render(h('h1', null, 'Hello World!'), document.getElementById('app'));
      });
    </script>
  </body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...