Question

我有一个名为Home的React组件。在Home中，我有一个函数“urlListener”，我在其中添加了一个事件监听器，以便在更改URL时发出警报。

var Home = React.createClass({
	getInitialState: function () {
		return {
			openedFile: this.props.location.query.file || '',
			apps: [],
			showNav: this.props.location.query.file ? false : true,
			layout: 'row',
			cloneAppName: 'New Application',
			appName: 'Application Name',
			showSave: false
		}
	},
	urlListener: function(){
		window.addEventListener("hashchange", function(){
                       saveUnsaved();
		});
	},
        saveUnsaved: function(){
        }

侦听器工作正常，只要URL发生更改，就会调用它。但是，控制台说我试图调用的函数不是函数。我是React的新手，对此有任何帮助将不胜感激。

Answer 1

有人评论了似乎对我有用的答案，但在我接受答案之前，评论已被删除。正确的做法是

＆＃13;

{() => this.saveUnsaved();}

＆＃13;

箭头功能显然会切换＆＃34;窗口＆＃34;在内部＆＃34;这个＆＃34;（当前组件）。没有箭头功能，＆＃34;这个＆＃34;将指的是＆＃34;窗口＆＃34;成分

Answer 2

完美适合我。

// ES6:
componentDidMount() {
  window.addEventListener('popstate', this.handleOnUrlChange, false)
}
componentWillUnmount() {
  window.removeEventListener('popstate', this.handleOnUrlChange, false)
}
handleOnUrlChange = () => {
// your code
}

ReactJS window.addEventListener（“hashchange”）不起作用

2 个答案: