二级菜单导航是一种很普遍的功能,一般网页都会有这个功能。如果是平常的做法就是改变url,跳到相应的页面;还有一种就是frame。
如果用vue的话,可以用vue-router改变
html
使用 Vue.js 时,我们就已经把组件组合成一个应用了,当你要把 vue-router 加进来,只需要配置组件和路由映射,然后告诉 vue-router 在哪里渲染它们。
首页
定义路由。每个路由应该映射一个组件。 其中”component” 可以是组件等。 创建和挂载根实例。记得要通过 router 配置参数注入路由,从而让整个应用都有路由功能
var router = new VueRouter({
routes: [
{path: '/',component: Home},{path: '/picture',component: Picture},{path: '/music',component: Music},{path: '/article',component: Artlist},{path: '/article/:id',component: Article}
]
})
new Vue({
el: "#app",router: router
})
切换到了文章部分时,我又弄了个文章列表,点击文章标题才进入文章内容。
{{post.title}}
\{{post.body}}
\本文已被整理到了《》,欢迎大家学习阅读。
原文链接:https://www.f2er.com/vue/44023.html