Yêu cầu thg 12 27, 2019 9:50 SA 1262 0 2
  • 1262 0 2
0

Ngăn sự kiện reload page

Chia sẻ
  • 1262 0 2

Hello mn ! Mình có vấn đề này mong được các bạn giúp đỡ. Minh đang làm project bằng React, App của mình có chứa Form nhập liệu. Giờ m muốn bắt sự kiện khi người dùng reload page (nhấn F5 hoặc nút refresh của browser) thì sẽ ngăn sự kiện reload lại và hiện pop-up cảnh báo với người dùng ( nội dung là nếu reload dữ liệu đang nhập sẽ bị mất hết, bạn có muốn không ?)

Đây là đoạn code của mình:


  componentDidMount() {
    window.addEventListener('beforeunload', this.handleLeavePage);
  }

  componentWillUnmount() {
    window.removeEventListener('beforeunload', this.handleLeavePage);
  }

  handleLeavePage = (event) => {
    event.preventDefault();
    this.setState({openPopup: true});
  }

Nhuwng mình test thử thì nó không chặn được và vẫn bị load lại . Các bạn có thể giúp m được không. Mình xin cám ơn nhiều ạ !

2 CÂU TRẢ LỜI


Đã trả lời thg 12 27, 2019 10:40 SA
+1

Bạn thử như này xem được không

componentDidMount() {
    window.onbeforeunload = function() {
        this. handleLeavePage();
        return;
    }.bind(this);
}
Chia sẻ
Avatar Hoang vn @wiliamfeng
thg 12 27, 2019 10:48 SA

tks bạn, để tối về mình check lại nhé

Avatar Hoang vn @wiliamfeng
thg 12 28, 2019 3:27 SA

@quankm1097 mình test thừ không được bạn ơi, nó không ngăn được sự kiện và vẫn bị reload lại page

Avatar Hoang vn @wiliamfeng
thg 12 30, 2019 6:44 SA

Các b giúp đỡ m với

Đã trả lời thg 12 31, 2019 3:14 SA
0

Có ai ghé qua không giúp m với ạ 😢

Chia sẻ
thg 12 31, 2019 10:04 SA

Bác có thể thử đoạn JS này:
window.onbeforeunload = function(){ return "Are you sure you want to leave our website?"; };
T không chắc là có thể customize lại cái message.

thg 12 31, 2019 10:09 SA
Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí