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

Question

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

我如何做到这一点，所以我只声明一次该变量，然后在整个vue组件中使用一个实例？

Answer 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);
   });
...