У меня есть реактивный компонент, такой как:

import React, { PropTypes, Component } from 'react'


class MyComponent extends Component {

    componentDidMount() {
       window.addEventListener("beforeunload", function (event) {
            console.log("hellooww")
            event.returnValue = "Hellooww"
        })
    }

    componentWillUnmount() {
        window.removeEventListener("beforeunload", function (event) {
            console.log("hellooww")
            event.returnValue = "Hellooww"
        })
    }

    render() {

        return (
            <div>
                Some content
            </div>
        )
    }

}

export default MyComponent

Здесь к компоненту добавлен список событий. Когда я обновляю страницу, появляется всплывающее окно с просьбой покинуть страницу.

Но когда я перехожу на другую страницу и обновляю ее, снова появляется то же самое всплывающее окно.

Я удаляюeventListener из компонента наcomponentWillUnmount, Тогда почему он не удаляется?

Как я могу удалитьbeforeunload событие на других страницах?