1 Star 0 Fork 8

杨泽洲/learn-vue

forked from 高鹏/learn-vue 
加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
文件
该仓库未声明开源许可证文件(LICENSE),使用请关注具体项目描述及其代码上游依赖。
克隆/下载
demo_031.html 1.30 KB
一键复制 编辑 原始数据 按行查看 历史
F_喜欢足球 提交于 2020-03-26 15:50 . Vue的命名路由
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="https://cdn.bootcss.com/vue/2.6.11/vue.min.js"></script>
<script src="https://cdn.bootcss.com/vue-router/3.1.3/vue-router.min.js"></script>
</head>
<body>
<div id="app">
<!-- 命名路由 -->
<router-view name="x"></router-view>
<router-view name="y"></router-view>
<router-view name="z"></router-view>
</div>
<template id="t1">
<div>组件1</div>
</template>
<template id="t2">
<div>组件2</div>
</template>
<template id="t3">
<div>组件3</div>
</template>
<script>
var c = {
template: "#t1"
};
var c2 = {
template: "#t2"
};
var c3 = {
template: "#t3"
};
var router = new VueRouter({
routes:[
{
path:"/a", components: {
"x": c,
"y": c2,
"z": c3
}
},
]
});
var app = new Vue({
el: "#app",
router
});
</script>
</body>
</html>
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化
1
https://gitee.com/yang-zezhou/learn-vue.git
git@gitee.com:yang-zezhou/learn-vue.git
yang-zezhou
learn-vue
learn-vue
master

搜索帮助

0d507c66 1850385 C8b1a773 1850385