在整个 Vue 组件中使用变量？

【问题标题】：Use a variable throughout a Vue component?在整个 Vue 组件中使用变量？
【发布时间】：2019-05-03 02:47:22
【问题描述】：

我正在尝试在 vue 组件中实现 socket.io 消息传递系统。我一直声明一个变量赋值给require('socket.io-client')。

我是怎么做到的，所以我只声明这个变量一次，然后在整个 vue 组件中使用一个实例？

【问题讨论】：

【解决方案1】：

在脚本标签内可以导入socket-io.client，如下所示；

<script>
import io from 'socket.io-client';
...

导入后，你可以通过创建一个io的实例，在数据中声明一个名为socket的变量

export default {
   data() {
     return {
       socket: io("Your socket url")
...

您可以在 created() 生命周期方法中使用套接字变量，例如这样；

created() {
   this.socket.emit('LOGIN');
   this.socket.on('CREATED', data => {
      console.log(data);
   });
...

【讨论】：