Toast.vue 1.4 KB
<template>
    <div id="toast" class="toast-css" v-show="toastFlag">
        <i><span class="unmfsize" id="num">{{t}}</span>
            <span style="font-size:12px">{{$t('language.text')}}</span>
        </i>
    </div>
</template>
<script>
export default {
    name:'Toast',
    data() {
        return {
            toastFlag:false,
            t:5,
            text:'秒即将进入主页'
        }
    },
    methods: {
        toast(){
            this.toastFlag=true;
            console.log('ttt=='+this.t)
        // $("#num").html(this.t);
        if(this.t>0){
          this.t--;
        }else{
            // $("#toast").addClass("hide");
            this.toastFlag=false;
            this.t=5;
            this.$router.push('/Home')
            // location.href = "https://www.baidu.com/";
          // window.open("https://www.baidu.com/");
            return
        }
        
        setTimeout(this.toast,1000);
      }
    },
    mounted(){
        // this.text=this.$t('language.text');
    }
    
}
</script>
<style lang="less">
    .toast-css {
        font-size: 0.32rem;
        color: #ffffff;
        background-color: rgba(0, 0, 0, 0.6);
        padding: 10px 15px;
        margin: 0 0 0 -60px;
        border-radius: 4px;
        position: fixed !important;
        top: 50%;
        left: 50%;
        width: 130px;
        text-align: center;
    }
    .unmfsize{
        font-size: 12px;
    }
</style>