Прекратить загрузку Webview в React Native

У меня есть собственный проект на платформе Android. У меня есть веб-просмотр, загруженный с URL-адреса. Когда пользователь щелкает любой URL-адрес, я хочу перейти на экран в моем приложении, и веб-просмотр перестанет загружаться. Итак, в моей функции onNavigationStateChange ()

  source = {{uri:this.props.htmlUrl}}
    ref='_webView'
    scrollEnabled = {true}
    javaScriptEnabled = {true}
    domStorageEnabled = {true}
    onNavigationStateChange  = {(navState)=>{
      //handle navigate another screen
       this.refs._webView.stopLoading();
    }}

Оно работает. Поэтому, когда я возвращаюсь и нажимаю другой URL-адрес, я не могу коснуться ни одного URL-адреса в веб-просмотре. Если у кого-то возникнет такая же проблема, пожалуйста, помогите мне. Заранее спасибо.

Вам не нужно останавливать загрузку веб-просмотра, он перестанет загружаться, когда завершит загрузку веб-страницы, на которой вы находитесь. Кроме того, onNavigationStateChange - не лучшее место для остановки WebView, зарегистрируйте navState, вы увидите, что он вызывается много раз, прежде чем страница полностью загрузится. Вы не хотите останавливать загрузку страницы до того, как большинство элементов на ней полностью загрузятся. Если вы пытаетесь остановить запущенный скрипт на странице, вам следует взглянуть на внедрение JavaScript в WebView, чтобы остановить продолжение скрипта.

Nickmccomb 24.10.2018 09:48
medium.com/capriza-engineering/…
Nickmccomb 24.10.2018 09:48
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
2
3 852
2

Ответы 2

Вы можете проверить URL-адрес для ввода, и при нажатии на навигатор назад вы вводите ссылку только для проверки.

source = {{uri:this.props.htmlUrl}}
    ref='_webView'
    scrollEnabled = {true}
    javaScriptEnabled = {true}
    domStorageEnabled = {true}
    onNavigationStateChange  = {(navState)=>{
       if (navState.url == ""){ // You must validate url to enter or navigate
          this.refs._webView.stopLoading();
       }
    }}

Используйте опору onShouldStartLoadWithRequest из пакета react-native-webview.

onShouldStartLoadWithRequest = {event => {if (event.url== = "XXXX") return false; return true;}}

p.s. Верните true из функции, чтобы продолжить загрузку запроса, и false, чтобы остановить загрузку.

Другие вопросы по теме