React Native Webview 팝업
문제
- 기존 웹 페이지를 웹뷰로 App 내에서 나오게끔 하였으나 결제 모듈이 작동하지 않음
- 결제 모듈의 경우 새탭으로 띄워지기에 웹뷰에선 새로운 탭을 어떻게 처리할까? 고민중
해결방법 1. 이벤트를 상속 받자 (실패)
WebView 가 실행전에 아래 코드를 실행시켜 스택을 관리했다.
그러면 이 방식을 통해 새로운 탭이 켜진다 라는걸 인식하면 안될까?
const INJECTED_CODE = `
(function() {
function wrap(fn) {
return function wrapper() {
var res = fn.apply(this, arguments);
window.ReactNativeWebView.postMessage('navigationStateChange');
return res;
}
}
history.pushState = wrap(history.pushState);
history.replaceState = wrap(history.replaceState);
window.addEventListener('popstate', function() {
window.ReactNativeWebView.postMessage('navigationStateChange');
});
})();
true;
`;
해결방법 2. 웹뷰도 브라우저처럼 여러탭이 되지 않을까? ( 실패 -> 성공! )
관련 속성을 열어줬으나 실패 가 아니라 성공!
setSupportMultipleWindows={false} 를 통해 팝업창 열수 있도록 작업 하니 다행이 화면이 떳다!
Author And Source
이 문제에 관하여(React Native Webview 팝업), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@gavri/React-Native-Webview-팝업저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)