main.ts
import { createApp } from 'vue' import App from './App.vue' import router from './router' import store from './store' import ElementPlus from 'element-plus'; import 'element-plus/lib/theme-chalk/index.css'; const app = createApp(App); //全局掛載方法和原型 const test = () => { console.log('ccccc'); return '測試成功001'; }; app.config.globalProperties.$Test = test; app.config.globalProperties.$Testwo = '我是測試'; app.use(ElementPlus).use(store).use(router).mount('#app')
login.vue
<template> <div class="warpper-login"> <!-- 背景圖 --> <!-- 靜態版登錄背景 --> <div class="j-bc-loginBc"></div> <!-- 登錄框 --> <div class="login-panel"> <div class="login-welcome">welcome</div> <div class="info"> <div class="title-info"> <label class="icon icon-title"></label> <span>{{ title }}</span> </div> <div class="text-user"> <label class="icon icon-user"></label> <input type="text" v-model.trim="paramData.username" class="input" id="username" @keyup.enter="login" placeholder="請輸入帳號" /> </div> <div class="text-pass"> <label class="icon icon-pass"></label> <input type="password" v-model.trim="paramData.password" class="input password" @keyup.enter="login" placeholder="請輸入密碼" /> </div> <div class="submit" @click="goto"> <span>立 即 登 錄</span> </div> </div> </div> </div> </template> <script lang="ts"> import SourceMirror from '@/components/resource/dutyMirror'; import Cookies from 'js-cookie'; import { useRouter } from 'vue-router'; import { defineComponent, ref, reactive, toRefs, getCurrentInstance } from 'vue'; export default defineComponent({ setup(props, context) { const { proxy }: any = getCurrentInstance(); const title = ref('綜合指揮系統'); const router = useRouter(); const paramData = reactive({ username: '11', password: '' }); function goto() { const param = { name: paramData.username, password: paramData.password //admin@123.abx }; SourceMirror.login(param).then(res => { if (res.data.code === 200) { let accessToken = res.data.data.accessToken; sessionStorage.setItem('accessToken', accessToken); sessionStorage.setItem('userName', res.data.data.user.userName); Cookies.set('accessToken', accessToken); // router.push('/home'); } else { proxy.$message({ message: '登錄失敗', type: 'warning' }); } console.log(res); // router.push('/home'); }); } return { goto, paramData, title }; } }); </script> <style lang="less" scoped> </style>
解析:
const { proxy }: any = getCurrentInstance();