title: How to reconnect a websocket connection after manual close - Vue
body: <p>Here's my methods to open/close socket connection:</p>
  
  <pre><code>methods: {
    connect () {
      this.$socket.onopen = () =&gt; {
        this.status = 'connected'
        this.$socket.onmessage = ({data}) =&gt; {
          this.$socket.send(this.message)
          console.log({ event: "Recieved message", data })
        }
      }
      this.$socket.onclose = (e) =&gt; {
        console.log('Socket is closed. Reconnect will be attempted in 1 second.')
        setTimeout(() =&gt; {
          this.connect()
        }, 1000)
      }
    },
    disconnect () {
      this.$socket.close()
      this.status = 'disconnected'
    }
  }
  </code></pre>
  
  <p>I'm not using socket.io etc, just built in <code>Websocket</code> object.
  When i manually call <code>disconnect ()</code> method - it closes the connection as expected, but when i send message again - it says that connection is closed. Since i call <code>connect ()</code> in a mounted, then it won't reconnect if i don't refresh the page.</p>
  
  <p>I've tried using watcher:</p>
  
  <pre><code>watch: {
    '$socket': 'connect'
  }
  </code></pre>
  
  <p>But no effect. Is there a way to watch for websocket connection status? If it's closed - call <code>connect ()</code>, if it's error'ed - call <code>connect ()</code> to reconnect it.</p>