Vue.js 中的长轮询和独立于组件生命周期的 Vuex,在哪里存储 "unsubscribe" 的热可观察对象?
Long polling in Vue.js and Vuex that's independent of components' lifecycle, where to store hot observables for "unsubscribe"?
问题:已经启动了多个需要在整个应用程序生命周期中持续存在的长轮询流(无论各个组件的生命周期如何),我正在寻找一种方法来取消订阅以响应各种事件(例如路由更改, 但不限于)。为此,我编写了以下代码:
export const actions: ActionTree<TasksState, RootState> = {
async pollEventTasks({ dispatch, commit, state, rootState }, payload: any) {
const pollEventTasks$ = timer(0, 5000).pipe(
switchMap(_ => tasksService.loadTasksForEvent(payload.eventId)),
map((response: any) => {
commit('setTasks', response);
})
).subscribe();
// this won't work in strict mode. Hot observables ~can't~ shouldn't be written to store:
// commit('longPolling/eventTasksPollingStarted', pollEventTasks$, {root: true});
},
一个热可观察对象 "updates itself",因此在变异处理程序之外变异存储。什么是适合 vue/vuex 最佳实践的巧妙解决方案?
我们最终构建了一个通过 Vue.use
注入的插件并在那里存储 Observable 订阅
问题:已经启动了多个需要在整个应用程序生命周期中持续存在的长轮询流(无论各个组件的生命周期如何),我正在寻找一种方法来取消订阅以响应各种事件(例如路由更改, 但不限于)。为此,我编写了以下代码:
export const actions: ActionTree<TasksState, RootState> = {
async pollEventTasks({ dispatch, commit, state, rootState }, payload: any) {
const pollEventTasks$ = timer(0, 5000).pipe(
switchMap(_ => tasksService.loadTasksForEvent(payload.eventId)),
map((response: any) => {
commit('setTasks', response);
})
).subscribe();
// this won't work in strict mode. Hot observables ~can't~ shouldn't be written to store:
// commit('longPolling/eventTasksPollingStarted', pollEventTasks$, {root: true});
},
一个热可观察对象 "updates itself",因此在变异处理程序之外变异存储。什么是适合 vue/vuex 最佳实践的巧妙解决方案?
我们最终构建了一个通过 Vue.use
注入的插件并在那里存储 Observable 订阅