vue 极光推送

在 Vue 中使用极光推送可以通过调用 JPush 的 JavaScript SDK 实现。首先需要在 HTML 中引入 JPush SDK 的 JavaScript 文件：

<script src="//web.jpush.cn/sdk/js/jpush.min.js"></script>

然后在 Vue 组件中使用 JPush SDK 提供的 API 进行推送：

export default {
  mounted() {
    // 初始化 JPush SDK
    window.JPush.init()

    // 监听 JPush 推送事件
    document.addEventListener('jpush.receiveNotification', this.onReceiveNotification, false)
    document.addEventListener('jpush.receiveMessage', this.onReceiveMessage, false)
  },
  methods: {
    onReceiveNotification(event) {
      console.log('Received notification:', event)
    },
    onReceiveMessage(event) {
      console.log('Received message:', event)
    },
    pushNotification() {
      // 发送通知栏消息
      window.JPush.sendNotification('Hello, JPush!')
    },
    pushMessage() {
      // 发送自定义消息
      window.JPush.sendCustomMessage({ message: 'Hello, JPush!' })
    }
  }
}

需要注意的是，JPush SDK 在初始化时需要传入 App Key 和 Push Service Domain，可以在 JPush 控制台中找到。另外，在组件销毁时需要取消监听 JPush 推送事件，防止内存泄漏：

export default {
  beforeDestroy() {
    document.removeEventListener('jpush.receiveNotification', this.onReceiveNotification)
    document.removeEventListener('jpush.receiveMessage', this.onReceiveMessage)
  }
}

更多 JPush SDK 的使用方法请参考 JPush 官方文档。