<template> <div class="error-page"> <img :src="errorImageUrl"> <div class="error-text"> 404! 很抱歉,页面未找到 <br/> <div class="button" @click="$router.push({name:'index'})">返回首页</div> </div> </div> </template> <script> import errorImageUrl from '../assets/error.png' export default { name: "error", data(){ return{ errorImageUrl:errorImageUrl } } } </script> <style scoped lang="less"> .error-page{ text-align: center; padding-top:50px ; img{ width: 50%; margin-bottom: 20px; } .error-text{ font-size: 24px; color: #888; } .button{ font-size: 14px; display: inline-block; border: 1px solid #53b4ca; color: #53b4ca; padding: 5px; border-radius: 4px; margin-top: 20px; } } </style>