Vue router 一个路由对应多个视图

发布时间:2017-7-1 11:19:18编辑:www.fx114.net 分享查询网我要评论
本篇文章主要介绍了"Vue router 一个路由对应多个视图 ",主要涉及到Vue router 一个路由对应多个视图 方面的内容,对于Vue router 一个路由对应多个视图 感兴趣的同学可以参考一下。

使用命名路由

https://jsfiddle.net/posva/6du90epg/

<script src="https://unpkg.com/vue/dist/vue.js"></script><script src="https://unpkg.com/vue-router/dist/vue-router.js"></script><div id="app">  <h1>Named Views</h1>  <ul>    <li>      <router-link to="/">/</router-link>    </li>    <li>      <router-link to="/other">/other</router-link>    </li>  </ul>  <router-view class="view one"></router-view>  <router-view class="view two" name="a"></router-view>  <router-view class="view three" name="b"></router-view></div>
const Foo = { template: '<div>foo</div>' }const Bar = { template: '<div>bar</div>' }const Baz = { template: '<div>baz</div>' }const router = new VueRouter({  mode: 'history',  routes: [    { path: '/',      // a single route can define multiple named components      // which will be rendered into <router-view>s with corresponding names.      components: {        default: Foo,        a: Bar,        b: Baz      }    },    {      path: '/other',      components: {        default: Baz,        a: Bar,


上一篇:用Spider引擎解决数据库垂直和水平拆分的问题
下一篇:如何启动、关闭和设置ubuntu防火墙

相关文章

相关评论

本站评论功能暂时取消,后续此功能例行通知。

一、不得利用本站危害国家安全、泄露国家秘密,不得侵犯国家社会集体的和公民的合法权益,不得利用本站制作、复制和传播不法有害信息!

二、互相尊重,对自己的言论和行为负责。

好贷网好贷款