React Native Webview нажал новую страницу на <a>нажал

Question

Я пытаюсь создать гибридное нативное приложение для размещения контента моего сайта в веб-просмотрах. Примерно так: Supreme App

Одна вещь, которую я хочу достичь: когда на моем веб-сайте нажимается ссылка <a href>, а не в веб-просмотре просто отображается содержимое новой ссылки, я хочу, чтобы приложение открывало новую страницу и отображало новое содержимое ссылки в новая страница, так что я могу поддерживать хороший backstack страницы, и это больше похоже на нативное приложение (для каждой навигации есть новая страница для него).

Мне интересно, как я могу обнаружить клик по ссылке, нажать новую страницу вместо того, чтобы веб-просмотр делал навигацию по умолчанию. Спасибо!

Answer 1

Вы можете использовать WebView prop onNavigationStateChange, чтобы обнаружить изменение в URL.

При нажатии <a> перенаправляется webview, срабатывает onNavigationStateChange.Вы можете использовать этот обратный вызов, чтобы открыть новый экран в приложении.

Например.

       <WebView
             ref={r => this.webview = r}
             style = {{marginTop : 0}}
             onNavigationStateChange={this._onNavigationStateChange}
             source = {{uri: 'https://www.your-url.com' }}
       />


      _onNavigationStateChange=(webViewState)=>{
          let newUrl = webViewState.url
          /*Your navigation logic*/
       }

Ссылка