文章/答案/技术大牛

发布

社区首页 >问答首页 >Vue Socket.io-切换路由器页面后，扩展了this.$socket.$subscribe不是一个函数

问Vue Socket.io-切换路由器页面后，扩展了this.$socket.$subscribe不是一个函数
EN

Stack Overflow用户

提问于 2020-01-05 22:09:03

回答 1查看 1.8K关注 0票数 2

我已经设置了一个简单的Vue应用程序，应该连接到带有Websockets的nodeJS服务器。

我使用的是socket.io-extended。

我已经使用文档将websocket连接插入到一个组件中。刷新页面时，连接工作正常，没有问题。但是，当我使用vue路由器切换页面，然后返回到websocket页面时，我得到以下控制台消息：

vue.runtime.esm.js?2b0e:619 [Vue warn]: Error in mounted hook: "TypeError: this.$socket.$subscribe is not a function"

found in

---> <Index> at src/components/Client/LiveDataDrink/Index.vue
       <VContent>
         <VApp>
           <App> at src/App.vue
             <Root>
warn @ vue.runtime.esm.js?2b0e:619
logError @ vue.runtime.esm.js?2b0e:1884
globalHandleError @ vue.runtime.esm.js?2b0e:1879
handleError @ vue.runtime.esm.js?2b0e:1839
invokeWithErrorHandling @ vue.runtime.esm.js?2b0e:1862
callHook @ vue.runtime.esm.js?2b0e:4213
insert @ vue.runtime.esm.js?2b0e:3139
invokeInsertHook @ vue.runtime.esm.js?2b0e:6340
patch @ vue.runtime.esm.js?2b0e:6559
Vue._update @ vue.runtime.esm.js?2b0e:3942
updateComponent @ vue.runtime.esm.js?2b0e:4060
get @ vue.runtime.esm.js?2b0e:4473
run @ vue.runtime.esm.js?2b0e:4548
flushSchedulerQueue @ vue.runtime.esm.js?2b0e:4304
eval @ vue.runtime.esm.js?2b0e:1980
flushCallbacks @ vue.runtime.esm.js?2b0e:1906
Promise.then (async)
timerFunc @ vue.runtime.esm.js?2b0e:1933
nextTick @ vue.runtime.esm.js?2b0e:1990
queueWatcher @ vue.runtime.esm.js?2b0e:4396
update @ vue.runtime.esm.js?2b0e:4538
notify @ vue.runtime.esm.js?2b0e:730
reactiveSetter @ vue.runtime.esm.js?2b0e:1055
eval @ vue-router.esm.js?8c4f:2748
eval @ vue-router.esm.js?8c4f:2747
updateRoute @ vue-router.esm.js?8c4f:2174
eval @ vue-router.esm.js?8c4f:2037
eval @ vue-router.esm.js?8c4f:2159
step @ vue-router.esm.js?8c4f:1843
step @ vue-router.esm.js?8c4f:1850
runQueue @ vue-router.esm.js?8c4f:1854
eval @ vue-router.esm.js?8c4f:2154
step @ vue-router.esm.js?8c4f:1843
eval @ vue-router.esm.js?8c4f:1847
eval @ vue-router.esm.js?8c4f:2139
eval @ vue-router.esm.js?8c4f:1921
iterator @ vue-router.esm.js?8c4f:2120
step @ vue-router.esm.js?8c4f:1846
step @ vue-router.esm.js?8c4f:1850
step @ vue-router.esm.js?8c4f:1850
runQueue @ vue-router.esm.js?8c4f:1854
confirmTransition @ vue-router.esm.js?8c4f:2147
transitionTo @ vue-router.esm.js?8c4f:2034
push @ vue-router.esm.js?8c4f:2365
push @ vue-router.esm.js?8c4f:2782
handler @ vue-router.esm.js?8c4f:1066
invokeWithErrorHandling @ vue.runtime.esm.js?2b0e:1854
invoker @ vue.runtime.esm.js?2b0e:2179
original._wrapper @ vue.runtime.esm.js?2b0e:6911
Show 18 more frames
vue.runtime.esm.js?2b0e:1888 TypeError: this.$socket.$subscribe is not a function
    at VueComponent.mounted (Index.vue?b484:23)
    at invokeWithErrorHandling (vue.runtime.esm.js?2b0e:1854)
    at callHook (vue.runtime.esm.js?2b0e:4213)
    at Object.insert (vue.runtime.esm.js?2b0e:3139)
    at invokeInsertHook (vue.runtime.esm.js?2b0e:6340)
    at VueComponent.patch [as __patch__] (vue.runtime.esm.js?2b0e:6559)
    at VueComponent.Vue._update (vue.runtime.esm.js?2b0e:3942)
    at VueComponent.updateComponent (vue.runtime.esm.js?2b0e:4060)
    at Watcher.get (vue.runtime.esm.js?2b0e:4473)
    at Watcher.run (vue.runtime.esm.js?2b0e:4548)

websocket

socket.io

javascript

vue.js

回答 1

Stack Overflow用户

发布于 2020-04-30 22:53:49

这对我的动态监听器是有效的：

this.sockets.subscribe('EVENT_NAME', (data) => {
    this.msg = data.message;
});

this.sockets.unsubscribe('EVENT_NAME');

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/59600697

复制

相似问题

问Vue Socket.io-切换路由器页面后，扩展了this.$socket.$subscribe不是一个函数
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Vue Socket.io-切换路由器页面后，扩展了this.$socket.$subscribe不是一个函数EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Vue Socket.io-切换路由器页面后，扩展了this.$socket.$subscribe不是一个函数
EN