Tôi sử dụng chế độ xem web Phản hồi gốc để hiển thị index.html
và HTML sẽ đăng sự cố vào ứng dụng. Sau đó, ứng dụng sẽ nhận được tin nhắn và viết nó vào bảng điều khiển. Vấn đề là ứng dụng không thể nhận tin nhắn, khi postMessage
được chạy ngay lập tức trên đầu. Tôi nghĩ rằng nó có thể liên quan đến HTML không tải xong. Sau đó tôi đã sử dụng một sự chậm trễ với setTimeout
và nó hoạt động.phản hồi postMessage html gốc không thể truy cập vào WebView
Bây giờ tôi muốn biết:
- Có cách nào tốt hơn để giải quyết vấn đề này?
- Tại sao sự chậm trễ 100 milliscond không hoạt động, nhưng trì hoãn 200 milliscond đã làm?
Tôi đang sử dụng React Native phiên bản 0.39.0 và phiên bản Node 7.2.0.
Dưới đây là đoạn code tôi có cho đến nay:
index.html
<head>
<title>Index</title>
<script type="text/javascript" src="index.js"></script>
<script type="text/javascript">
// can not be received
postMessage('send to react native from index inline, no delay', '*');
// can not be received
setTimeout(function(){
postMessage('send to react native from index inline, delay 0 milliscond', '*')
}, 0);
// can received
setTimeout(function(){
postMessage('send to react native from index inline, delay 100 milliscond', '*')
}, 100);
onload = function() {
// can not be received
postMessage('send to react native from index inline after onload, no delay', '*')
// can received
setTimeout(function() {
postMessage('send to react native from index inline after onload, delay 0 milliscond', '*')
}, 0);
};
</script>
index.js
// can not be received
postMessage('send to react native from index.js, no delay', '*');
// can not be received
setTimeout(function() {
postMessage('send to react native from index.js, delay 100 milliscond', '*')
}, 100);
// can received
setTimeout(function() {
postMessage('send to react native from index.js, delay 200 milliscond', '*')
}, 200);
Phản ứng web_view_page.js Native
return (
<WebView
source={{uri: 'http://127.0.0.1:8000/index.html'}}
onMessage={(event) => console.log('onMessage:', event.nativeEvent.data)}/>
);
Chrome console log
2016-12-21 11:45:02.367 web_view.js:147 onMessage: send to react native from index inline after onload, delay 0 milliscond
2016-12-21 11:45:02.491 web_view.js:147 onMessage: send to react native from index inline, delay 100 milliscond
2016-12-21 11:45:02.628 web_view.js:147 onMessage: send to react native from index.js, delay 200 milliscond