前言

刚开始使用 vue3 的时候，总是会带着点 vue2 的思想残留，被 vue2 中的 this 所支配。不自觉地习惯性使用 this ，开发环境是不报错的，编译打包后才报错。所以，在 vue3 中使用 this ，是巨坑。

Vue3中this的替代方案、以及使用ctx打包后指向错误

setup 在生命周期 beforecreate 和 created 前执行，此时 vue 实例对象还未创建，因此无法使用我们在 vue2.x 中常用的 this。解决办法是调用 vue 中的 getCurrentInstance() 方法返回上下文，即当前实例。

vue3使用ctx样例

import {getCurrentInstance，onMounted } from "vue";
export default {
  setup( ) {
    const { ctx } = getCurrentInstance(); //获取上下文实例，ctx=vue2的this
    onMounted(() => {
      console.log(ctx, "ctx");
      ctx.http();
    });
  },
};

ctx 在开发环境下展开的结果，看起来似乎一切正常。

但项目打包编译后运行，报错。

http()方法执行报错，再展开 ctx 的打印结果来比较。

与开发环境下的ctx完全不同。

Vue3的this替代方案：使用proxy

在结构的时候直接将proxy结构出来，但还是建议放弃使用“this”当前实例操作的方式。

import {getCurrentInstance，onMounted } from "vue";
export default {
  setup( ) {
    const { proxy, ctx } = getCurrentInstance() //获取上下文实例，ctx=vue2的this
    onMounted(() => {
      console.log(proxy, "proxy");
      proxy.http();
    });
  },
};

开机启动权限设置

在注册表正确写入的情况下，设置了 electronBuilder 下 requestedExecutionLevel 的最高权限。requireAdministrator 依然不能正常开机自动启动程序。把这行代码注释掉，就能正常开机自动启动程序，具体原因还在探究。

同时附上开机启动对注册表操作的代码，以供参考。

总结

平时要多打包测试，发现问题及时解决。日后有遇到什么坑，再继续记录分享给大家。

下期跟大家聊聊微服务的发展史，敬请期待~

欢迎各位关注、留言，大家的支持就是我的动力！