main.vue

<template>
  <transition name="logo-fade">
    <div style="align:center" v-show="show">
      <span style="font-size:100px;margin-top:15%;margin-bottom:0;margin-left:auto;margin-right:auto;background-color:black;color:white;width:622px;display:block">合同管理系统</span>
      <img src="../assets/logo.png" alt="">
    </div>
  </transition>
</template>
<script>
export default {
  data(){
    return {
      show:false
    }
  },
  mounted() {
    this.show = true;
  },
};
</script>

<style scoped>
.logo-fade-enter-active {
  transition: all 3.5s ease;
}
.logo-fade-enter {
  opacity: 0;
}
</style>