01/10/2018, 08:26
Hỏi về sự kiện bấm ra ngoài component
Cho mình xin hỏi có cách nào để biết khi user bấm ra ngoài một component nào đó ở trong React-Native không?
Ví dụ như bấm ra ngoài TextInput thì chạy blur, hoặc tắt popup đi.
Hoặc ví dụ giống như ô tìm kiếm của dạy nhau học, bấm vào kính lúp thì hiện ra popup/component tìm kiếm, bấm ra ngoài thì nó biến mất.
Mình đã thử dùng PanResponder (onStartShouldSetPanResponder, đặt ở view tổng), và nhược điểm của nó là nó steal hết quyền respond của các component khác, nếu chỉ handle ở đây rồi return true thì chỉ được event kiểu như onPressDown. Mình cần event kiểu như onPressUp ấy, chứ không phải onPressDown.
Bài liên quan
Javascript Native thì bạn chặn Bubble (sự kiện nổi bọt trong nhiều lớp Document Object)
event.stopPropagation()
Chú ý: đặt trong sự kiện của lớp con
Mình dùng React Native và mình không biết đặt event.stopPropagation() ở đâu cả
Ví dụ cho bạn dễ thấy như này:
Ta có các đối tượng DOM:
<body>
<input id="search"/>
</body>
Script bắt sự kiện:
var el_child = document.getElementById( ‘search’ );
el_child.addEventListener( ‘mousedown’ , function( event ){
event.stopPropagation();
}
var el_parent = document.body;
el_parent.addEventListener( ‘mousedown’ , function(){
el_child.style.borderColor = “red”;
}
Có nghĩa là
<input>
nằm trong<body>
xảy ra trường hợp:stopPropagation
để chặn nó lạiMình viết tay trên đt nếu có lỗi xảy ra bạn thông cảm nhé
Không bạn ơi, React Native làm gì có mấy cái đó như HTML đâu.
Mình chỉ mô tả thôi , còn dùng Reactjs bạn làm như này:
reactjs.org
Handling Events – React
A JavaScript library for building user interfaces
ReactJS - Add custom event listener to component