uni-app openEmbeddedMiniProgram会调用两次接口（已解决）

在 uni-app 中使用 openEmbeddedMiniProgram 打开小程序时，可能会出现接口被调用两次的情况。这个问题通常是由于生命周期钩子或事件监听器的重复调用导致的。以下是一些常见的解决方法和排查步骤：

1. 检查生命周期钩子

确保你在 onLoad 或 onShow 等生命周期钩子中没有重复调用 openEmbeddedMiniProgram 方法。

export default {
  onLoad() {
    // 确保只调用一次
    this.openMiniProgram();
  },
  methods: {
    openMiniProgram() {
      uni.openEmbeddedMiniProgram({
        appId: 'your-mini-program-appid',
        path: 'pages/index/index',
        success(res) {
          console.log('打开小程序成功', res);
        },
        fail(err) {
          console.error('打开小程序失败', err);
        }
      });
    }
  }
};

2. 避免重复事件监听

如果你在某个事件监听器中调用了 openEmbeddedMiniProgram，确保该事件不会被多次触发。

export default {
  methods: {
    handleClick() {
      // 确保只调用一次
      this.openMiniProgram();
    },
    openMiniProgram() {
      uni.openEmbeddedMiniProgram({
        appId: 'your-mini-program-appid',
        path: 'pages/index/index',
        success(res) {
          console.log('打开小程序成功', res);
        },
        fail(err) {
          console.error('打开小程序失败', err);
        }
      });
    }
  }
};

3. 防抖处理

如果事件可能会被多次触发，可以使用防抖（debounce）来避免多次调用。

import { debounce } from 'lodash';

export default {
  methods: {
    handleClick: debounce(function() {
      this.openMiniProgram();
    }, 300),
    openMiniProgram() {
      uni.openEmbeddedMiniProgram({
        appId: 'your-mini-program-appid',
        path: 'pages/index/index',
        success(res) {
          console.log('打开小程序成功', res);
        },
        fail(err) {
          console.error('打开小程序失败', err);
        }
      });
    }
  }
};

4. 检查页面跳转逻辑

如果你在页面跳转时调用了 openEmbeddedMiniProgram，确保跳转逻辑不会导致多次调用。

5. 调试和日志

在开发过程中，可以通过添加日志来调试，确认 openEmbeddedMiniProgram 被调用的次数和时机。

export default {
  methods: {
    openMiniProgram() {
      console.log('调用 openEmbeddedMiniProgram');
      uni.openEmbeddedMiniProgram({
        appId: 'your-mini-program-appid',
        path: 'pages/index/index',
        success(res) {
          console.log('打开小程序成功', res);
        },
        fail(err) {
          console.error('打开小程序失败', err);
        }
      });
    }
  }
};

6. 检查组件重复渲染

如果 openEmbeddedMiniProgram 是在组件中调用的，确保组件没有因为状态或属性的变化而重复渲染。

7. 使用标志位

可以使用一个标志位来确保 openEmbeddedMiniProgram 只被调用一次。

export default {
  data() {
    return {
      isOpened: false
    };
  },
  methods: {
    openMiniProgram() {
      if (this.isOpened) return;
      this.isOpened = true;
      uni.openEmbeddedMiniProgram({
        appId: 'your-mini-program-appid',
        path: 'pages/index/index',
        success(res) {
          console.log('打开小程序成功', res);
        },
        fail(err) {
          console.error('打开小程序失败', err);
        }
      });
    }
  }
};