vue引入sdk后的回调问题

Question

是sdk的回调问题，框架是vue + electron，PC的跨端开发，但是问题实际是Vue的
分为两个文件，一个是vue调用层，一个是js封装层
首先在vue文件（渲染层调用）

<div class="title" @click="leave">离开</div>
...

//script
import agora from "../utils/agora";  //引入js文件
//methods方法
leave(){
  agora.leave()
}

//agora.js
var agora = {};

const EventHandles = {
    // 监听离开频道事件
    onLeaveChannel: ({ channelId, localUid }, stats) => {
        console.log('成功退出频道：' + channelId);
    },
}

agora.init = function(){
  //这里是初始化，在项目刚启动的时候，用registerEventHandler函数注册监听回调，对象就是上面的EventHandles
  rtcEngine.registerEventHandler(EventHandles);
}

//离开房间
agora.leave = function () {
  //rtcEngine是一个已经加载完成的sdk对象
   rtcEngine.leaveChannel();
}

export default agora;

问题：在vue层我调用成功后，不能直接获取到leaveChannel()的结束状态，现在只能等待onLeaveChannel监听函数在控制台打印log告诉我结果，我希望的是在vue层通过

leave(){
  agora.leave(res=>{
      console.log('回调结果',res)
      //继续你想要执行的代码
   })
}

这种方式，来实时返回结果，而不是傻兮兮的等着监听函数的回调。遗憾的是sdk的方法并没有直接.then 或者是 .catch 的方式，这让我的vue层无法判断是成功还是失败状态
现在是通过js引入store，储存在state里面，然后vue通过watch监听状态。非常繁琐。有没有什么其他办法？

Answer 1

引自强大而免费的微信小程序：皆我百晓生。如有帮助，还望采纳。

---

由于SDK的方法没有直接的.then或.catch方式来返回状态，我们可以考虑使用Promise来解决这个问题。在agora.js中，我们可以将leave方法改为返回一个Promise对象，然后在onLeaveChannel回调中resolve或reject该Promise对象，以传递相应的状态。

下面是修改后的agora.js文件示例：

var agora = {};

const EventHandles = {
    // 监听离开频道事件
    onLeaveChannel: (channelId, localUid, stats) => {
        console.log('成功退出频道：' + channelId);
        agora.leavePromise.resolve(); // 成功离开频道时，resolve Promise对象
    },
}

agora.init = function(){
  //这里是初始化，在项目刚启动的时候，用registerEventHandler函数注册监听回调，对象就是上面的EventHandles
  rtcEngine.registerEventHandler(EventHandles);
}

agora.leave = function () {
  agora.leavePromise = {} // 创建一个leavePromise对象，用于返回Promise实例
  agora.leavePromise.promise = new Promise((resolve, reject) => {
    agora.leavePromise.resolve = resolve; // 将resolve函数保存在leavePromise对象中
    rtcEngine.leaveChannel();
  });
  return agora.leavePromise.promise;
}

export default agora;

然后在vue文件中，你可以像这样调用leave方法并处理回调结果：

leave(){
  agora.leave().then(res => {
    console.log('回调结果', res);
    //继续你想要执行的代码
  });
}

这样，你就能够通过Promise的方式实时获取回调结果，而不需要等待监听函数的回调了。