<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="vue.js"></script>
<script src="vue-router.js"></script>
</head>
<body>
<div id="div1">
<router-link to="/news">新闻</router-link>
<router-link to="/enter">娱乐</router-link>
<router-link to="/mess">资讯</router-link>
<router-view name="header"></router-view>
<router-view></router-view>
<router-view name="footer"></router-view>
</div>
<script>
let headerR = {
template: '<div>header</div>'
};
let enterR = {
template: '<div>娱乐</div>'
};
let messR = {
template: '<div>资讯</div>'
};
let newsR = {
template: '<div>新闻</div>'
};
let footerR = {
template: '<div>footer</div>'
};
let router = new VueRouter({
routes: [{
path: '/news',
name: 'news',
components: {
header: headerR,
default: newsR,
footer: footerR
}
},
{
path: '/enter',
name: 'enter',
components: {
header: headerR,
default: enterR,
footer: footerR
}
},
{
path: '/mess',
name: 'mess',
components: {
header: headerR,
default: messR,
footer: footerR
}
}
]
});
let vm = new Vue({
el: "#div1",
router
})
</script>
</body>
</html>
781
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
