断开 Reflux listenTo 方法

Question

所以，我有两家商店。第一个 pageStore 服务于特定页面的业务逻辑，第二个 globalStore 逻辑服务于 Android/iOS 个全局事件。当用户进入特定页面时 React.componentDidMount 调用

pageEntered: function () {
    this.listenTo(globalStore, this.locationUpdated);
},

因此我的 pageStore 开始监听全球存储以获取 GPS 更新。但是有什么方法可以断开 React.componentWillUnmount 上的 listenTo 连接吗？

Answer 1

有一个如何取消订阅商店监听的例子（取自官方例子）：

var Status = React.createClass({
    getInitialState: function() { },
    onStatusChange: function(status) {
        this.setState({
            currentStatus: status
        });
    },
    componentDidMount: function() {
        this.unsubscribe = statusStore.listen(this.onStatusChange);
    },
    componentWillUnmount: function() {
        this.unsubscribe();
    },
    render: function() {
        // render specifics
    }
});

Answer 2

下面是思考上面示例中发生的事情的一种方法：

var myFunc = function(){
    console.log("This gets fired immediately");
    var randomNumber = Math.ceil(Math.random()*10);
    return function() {
        return randomNumber;
    }
}

var a = myFunc(); //Console log fires IMMEDIATELY, a is the returned function

a(); //some integer from 1 to 10

由于在将 myFunc 分配给变量时会调用它，因此 console.log 会立即触发——就像 this.unsubscribe = statusStore.listen(this.onStatusChange);一旦 componentDidMount 发生，"turns on" 立即监听。

在 componentDidMount 生命周期方法中，我们将监听器附加到使用 .listen。那是调用的。为方便起见，我们将函数的结果赋值给 this.unsubscribe.

如果您查看此要点 (https://gist.github.com/spoike/ba561727a3f133b942dc#file-reflux-js-L60-L68) 的第 60-68 行，请考虑 .listen 返回一个删除事件侦听器的函数。

在 componentWillUnmount 中，我们调用 this.unsubscribe 来删除侦听器。您可以将 .listen 视为返回一个删除 'listener' 的函数，当 componentWillUnmount 生命周期发生时，我们调用该函数并终止侦听器。

Tl;dr：假设 .listen 附加了一个侦听器和 returns 一个关闭侦听器的函数——当你第一次调用它时，侦听器打开，当你调用函数时返回它关闭监听器

断开 Reflux listenTo 方法

Disconnect Reflux listenTo method

reactjs

refluxjs