<template>
|
<div style="width:100%;">
|
|
<div style="width:600px;height:600px;margin:calc((100vh - 600px) / 2) auto;text-align: right;">
|
<span class="return-span" @click="goIndex">返回首页</span>
|
<svg-icon name="404" width="600" height="600" color="var(--el-color-primary)" ></svg-icon>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import { toRefs, reactive, getCurrentInstance, nextTick, defineComponent } from 'vue';
|
export default defineComponent({
|
name: 'demo',
|
props: {},
|
components: {},
|
setup() {
|
|
let { proxy } = getCurrentInstance();
|
const state = reactive({
|
|
});
|
|
const goIndex = () => {
|
proxy.$router.replace("/");
|
}
|
|
return { ...toRefs(state), goIndex };
|
}
|
})
|
</script>
|
|
<style scoped lang='scss'>
|
$color: var(--el-color-primary);
|
$color1: var(--el-color-primary-light-9);
|
|
.return-span {
|
animation: glow 800ms ease-out infinite alternate;
|
cursor: pointer;
|
}
|
|
@keyframes glow {
|
0% {
|
color: $color;
|
}
|
|
100% {
|
color: white;
|
}
|
}
|
</style>
|