Vue.prototype.$Jmessage.loading('登录已过期，正在重新登陆', 0)；vue2转化vue3

在Vue.js中，`this.$Jmessage.loading`通常是通过引入某个第三方插件（如`vue-message-box`或自定义的`$message`模块）来提供消息提示的功能。这个代码片段表示当用户尝试登录且发现登录已经过期时，会显示一个加载状态，并且会在0秒后自动关闭。

在从Vue 2升级到Vue 3的过程中，由于Vue 3不再直接暴露`this`到全局，你需要做以下调整：

1. **使用Composition API**：
- 首先，如果你在使用 Composition API (setup()函数)，你可以创建一个自定义hook来管理加载提示：

     import { ref } from 'vue';
     const loading = ref(false);

     setup() {
       onMounted(() => {
         login().then(() => loading.value = true).catch(() => {
           loading.value = true;
           setTimeout(() => loading.value = false, 0);
         });
       });

       function login() {
         // 实现登录逻辑...
       }
     }

2. **使用Ref和自定义指令**：
- 如果仍在使用Options API，可以将`loading`作为一个ref，并使用自定义指令：

     import { ref, defineComponent } from 'vue';

     export default defineComponent({
       data() {
         return {
           loading: ref(false),
         };
       },
       methods: {
         handleLogin() {
           login()
             .then(() => this.loading.value = true)
             .catch(() => {
               this.loading.value = true;
               setTimeout(() => this.loading.value = false, 0);
             });
         },
       },
       directives: {
         'loading-end': {
           inserted(el, binding, vnode) {
             el.addEventListener('transitionend', () => {
               if (vnode.context.loading === false) {
                 el.style.display = 'none'; // 或者清除其他过渡效果
               }
             });
           },
           unbind(el) {
             el.removeEventListener('transitionend');
           },
         },
       },
       methods: {
         login() {
           // 实现登录逻辑...
         },
       },
     });

然后在模板上使用`v-loading-end`指令：

     <button v-if="!loading" @click="handleLogin">登录</button>
     <div v-loading-end>加载...</div>