404错误分为两种：
1> 页面中不存在该路由；
2> 页面中传递的参数在服务器端不存在，比如，个人中心是需要从后端获取数据的，但是你查询的用户是不存在的，此时也是404错误。
配置
在路由规则中，`*`代表的是任意字符。所以只要在路由的最后加一个`*`路由，那么以后没有匹配到的`url`都会被导入到这个视图中。
代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
<title>VueRouter-404错误配置</title>
</head>
<body>
<div id="app">
<ul>
<li>
<router-link to="/">首页</router-link>
</li>
<li>
<router-link to="/our/Xsan">我们</router-link>
</li>
</ul>
<router-view></router-view>
</div>
<script>
var index = Vue.extend({
template: "<h1>首页</h1>"
})
var our = Vue.extend({
template: "<h1>欢迎，{{$route.params.user}}</h1>"
})
var errPage = Vue.extend({
template: "<h1>404错误</h1>"
})
let router = new VueRouter({
routes: [{
path: "/",
component: index
}, {
path: "/our/:user",
component: our
}, {
path: "*",
component: errPage
}]
})
new Vue({
el: "#app",
router: router
})
</script>
</body>
</html>