javascript - 我如何停止流路由器中的订阅

Question

我正在尝试根据路线上的参数加载不同的第 3 方数据。路由不会改变，只是发送给它的参数。

我需要停止正在提取数据的订阅，清除数据，然后发送一个新的 API 请求来填充订阅。

我将 react-meteor 与 FlowRouter 结合使用(效果很好!)

-- View .jsx --

View = ReactMeteor.createClass({
    getMeteorState: function(){
        return {
            feed: Feed.find().fetch()
        }
    },

    render: function(){
        return (
             {this.state.feed.map(function(post, i){
                 return <ViewPost data={post} key={i} />
             })}
        )
    }

})

-- 菜单列表项.jsx --

MenuListItem = ReactMeteor.createClass({
    stopFeedSubscription: function(){
        FlowRouter.stop('feedSub')
        Feed.remove({})
    },

    render: function(){
        var route = "//view/"+this.props.data._id
        return (
                <li key={this.props.data._id} className="collection-item" data-post={this.props.data.name}>
                    <a href="#" data-route={route} className="btn-post-list" onClick={this.stopFeedSubscription}>{this.props.data.name}</a>
                </li>
            )
    }
})

单击菜单项时，我想停止向该订阅传入任何数据并从中删除所有内容。当/view/:id 被重新渲染时，对第 3 方 api 的新调用发生并获取新数据。

所有这些都有效，除了如果单击菜单项时数据仍在传入，它会显示在应该显示不同数据的新路由中。

Answer 1

Flow Router 无法停止订阅。我们可能也没有。如果您需要类似的东西，请尝试在 React 组件中管理订阅。

也许我们可以使用 SubsManager .无论如何，不​​确定这是否是您所需要的。

也有一种方法可以在路由器级别执行此操作。

尝试通过获取参数在路由器中定义订阅。因此，当您需要停止它时，将您的应用移至不同的路径。然后您之前的订阅会自动停止。

默认情况下，只有在当前路由上定义的订阅是事件的。更改路线时，之前的路线将被停用。