059——VUE中vue-router之路由嵌套在文章系统中的使用方法：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>vue-router之路由嵌套在文章系统中的使用方法：</title><script src="vue.js"></script><script src="vue-router.js"></script>
</head>
<body>
<div id="demo"><router-view></router-view>
</div>
<script type="text/x-template" id="home"><div><li v-for="v in news"><router-link :to="{name:'content',params:{id:v.id}}">{{v.title}}</router-link></li><router-view></router-view></div>
</script>
<script type="text/x-template" id="content"><div><h1>{{field.title}}——{{field.id}}</h1><div>{{field.content}}</div><router-link to="/">返回首页</router-link></div>
</script>
<script>var data = [{id: 1, title: 'php课程', content: 'php是非常牛的课程'},{id: 2, title: 'java课程', content: 'java是非常牛的课程'}];const home = {template: "#home",data() {return {news: data}}}const content = {template: "#content",data() {return {field: {}}},mounted() {var id = this.$route.params.id;for (let k = 0; k < data.length; k++) {if (data[k].id == id) {this.field = data[k]}}}};let routes = [{path: '/', component: home,children:[{path: '/content/:id', component: content, name: 'content'}]},];let router = new VueRouter({routes});new Vue({el: "#demo",router});
</script>
</body>
</html>

059——VUE中vue-router之路由嵌套在文章系统中的使用方法：相关推荐

vue中this.$router.push()路由传值和获取的两种常见方法
我们在做项目时 ,经常会遇到路由跳转页面传值的问题,有的路由跳转到导航页面时导航的样式也就改变了. 命名的路由(通过params) this.$router.push({name: "路径 ...
Vue中this.$router.push路由跳转,刷新参数消失
Vue中this.$router.push路由跳转,刷新参数消失 this.$router.push({name:"",params:{id:""}}) nam ...
Bootstrap网格系统工作原理、网格系统前缀、利用网格系统实现导航栏效果、栅格系统中的列嵌套、栅格系统中的列偏移、栅格系统中的自动布局列、栅格系统中的重排序、模仿淘宝网站商品展示的页面效果
Bootstrap 网格系统 1.Bootstrap网格系统工作原理 Bootstrap的网格系统是指将页面布局划分为等宽的列.随着屏幕或视口尺寸的增加,系统会自动分为1~12列. 网格系统用于通过一 ...
admin 系统被嵌套在第三方系统中的跨域异常
页面层级如下 top:www.a.com/index.html ----------------- iframe:www.b.com/page1.html------------------- --- ...
【Android 逆向】修改运行中的 Android 进程的内存数据 ( Android 系统中调试器进程内存流程 | 编译内存调试动态库以及调试程序 )
文章目录一.Android 系统中调试器进程内存流程二.编译内存调试动态库以及调试程序三.博客资源一.Android 系统中调试器进程内存流程修改游戏运行中的内存 , 游戏运行之后 , 游戏 ...
机器视觉系统中相机镜头选型技巧_工业相机在机器视觉系统中的地位和作用
一.什么是工业相机工业相机是机器视觉系统中的一个关键组件,其最本质的功能就是将光信号转变成有序的电信号.选择合适的相机也是机器视觉系统设计中的重要环节,相机的选择不仅直接决定所采集到的图像分辨率.图 ...
中事件源previous_PM2.5传感器在扬尘监测系统中的应用
社会的不断发展,空气质量在不断变差,灰霾天气空气中含有大量污染颗粒和微生物.2013年2月28日,全国科学技术名词审定委员会称PM2.5拟正式命名为"细颗粒物".除PM2.5外,还 ...
在linux中如何创建磁盘配额,如何在Linux系统中配置磁盘配额？
今天我们看看如何在Linux系统中配置磁盘配额,限制用户滥用空间.使用磁盘配额是相当简单的,对于限制那些过多占用磁盘空间的家伙很有用.而且,你还可以设置软配额和硬配额,软配额可以在某个用户接近其容量空 ...
计算机中复合模板在哪,冷冲模CAD系统中装配模板的设计与复合算法研究-计算机软件专业论文.docx...
冷冲模CAD系统中装配模板冷冲模CAD系统中装配模板的设计与复合算法研究摘要文章首先综述了国内外模具CAD/CAM技术的发展概况.指出了模具设计过程的规范化.设计方法的算法化及数据结构的合理 ...

059——VUE中vue-router之路由嵌套在文章系统中的使用方法：

059——VUE中vue-router之路由嵌套在文章系统中的使用方法：相关推荐

最新文章

热门文章