用于hashChange的eventListener

Question

我正尝试在ReactJS中为我的页面添加一个事件侦听器。我已经将它添加到componentDidMount()中。但是只有在初始页面加载时才会触发。

当地址栏中有变化时，我如何让它触发？

componentDidMount:function(){

        window.addEventListener("hashchange", console.log('hashchange1'));
        $(window).bind("hashchange", console.log('$ - hashchange'));
        window.onhashchange =  console.log('hashchange3');      
        ReactDOM.findDOMNode(this).addEventListener('hashChange',console.log('ReactDOM - hashchange'));
    },

我尝试了几种不同的方法来让它工作，但它们都只在第一次加载时起作用。我做错了什么？

谢谢。

Answer 1

您只需在每种情况下执行console.log，并将其返回值添加为侦听器。您需要将函数作为事件侦听器进行传递，例如：

window.addEventListener("hashchange", e => console.log('hashchange1', window.location.hash ));

https://jsfiddle.net/ku6okrp2/

使用ES5进行编辑，使其看起来更明显：

window.addEventListener("hashchange", function(e){ 
  console.log('hashchange1', window.location.hash )
});