Как использовать Ифраме в реакции нативного?

Я пытаюсь найти способ добавить Iframe в моё собственное приложение. Я нашел реакцию-iframe, но у меня это не сработало. Я последовал за документом. Я просто импортирую реагировать на iframe и копирую тег Iframe для использования. Мой результат похож на изображение ниже.

Мне нужен другой способ использовать Iframe в приложении. Спасибо.

Источник

5 ответов

Решение

Я отвечаю на мой вопрос.

Я использовал веб-просмотр для отображения Iframe.

<WebView
   source={{html: '<iframe width="100%" height="50%" src="https://www.youtube.com/embed/cqyziA30whE" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>'}}
   style={{marginTop: 20}}
/>
Источник

Попробуйте использовать WebView:

import { WebView } from 'react-native';

....

<WebView
          scalesPageToFit={true}
          bounces={false}
          javaScriptEnabled
          style={{ height: 500, width: 300 }}
          source={{
            html: `
                  <!DOCTYPE html>
                  <html>
                    <head></head> // <--add header styles if needed
                    <body>
                      <div id="baseDiv">${iframeString}</div> //<--- add your iframe here
                    </body>
                  </html>
            `,
          }}
          automaticallyAdjustContentInsets={false}
        />

Я использую его для отображения различного веб-контента, включая iframes, и он отлично работает.

https://facebook.github.io/react-native/docs/webview

Источник

Приведенные выше ответы работали нормально, если нужно было отображать только их, но для отображенияiframeсмешанный с другими данными, я нашел эту ссылку намного более полезной.

https://github.com/native-html/plugins/tree/master/packages/iframe-plugin#readme

Источник

Как насчет добавления ссылки iframe непосредственно в исходный атрибут веб-просмотра. Пример:

      <WebView
   source={{uri: 'https://www.youtube.com/embed/cqyziA30whE'}}
   style={{marginTop: 20}}
/>
Источник

Импортировать Ифраме из "Реакция-Ифраме"

<Iframe url = "http://www.youtube.com/" width="450px" height="450px" id="myId" className="myClassname" display="initial" position="relative"  allowFullScreen/>
Источник
Другие вопросы по тегам