VueUse 的 useWebSocket 具体怎么用？

<template>
  <div>
    <input type="text" v-model="message">
    <button @click="sendMessage">Send</button>
    <ul>
      <li v-for="msg in messages" :key="msg">{{ msg }}</li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: '',
      messages: []
    }
  },

  mounted() {
    this.$useWebsocket({
      url: 'ws://example.com/chat',
      onopen: () => {
        console.log('WebSocket connected');
      },
      onmessage: event => {
        this.messages.push(event.data);
      },
      onclose: () => {
        console.log('WebSocket closed');
      },
      onerror: (err) => {
        console.error(err);
      },
    });
  },

  methods: {
    sendMessage() {
      this.$websocket.send(this.message);
      this.message = '';
    },
  },
};
</script>