vue2中,根据list的id进入对应的详情页并修改title方法
发布时间：2020-12-17 02:13:05 所属栏目：百科 来源：网络整理
导读：一般项目中，我们会遇到有个list。。。然后你随便点击一个，会进入他对应的详情页。。。正常，那个详情页是一个公共的组件，我们只需根据id传值来判断，这个页面显示的是哪个list的数据即可。如图：点击电影进入电影详情……以此类推 具体代码如下： （有人
|
一般项目中，我们会遇到有个list。。。然后你随便点击一个，会进入他对应的详情页。。。正常，那个详情页是一个公共的组件，我们只需根据id传值来判断，这个页面显示的是哪个list的数据即可。如图：点击电影进入电影详情……以此类推
具体代码如下： （有人会奇怪，我为什么不循环……这个是根据项目需求而定的，这个相当于入口，而进入里面分别对应的还是多个list，并且后台给的图片的url也不一样，我懒得v-if去写了，so，这三个我就用了通过了路由id过去。当然，后面有循环list。。两种不同的方式，大家根据自己的项目来选择就好微笑） 而路由index.js里面需要如下写： require(['components/club/itemList.vue'],resolve)
},
这样就完成了初步的列表进入对应的页面。有人会发现， 看我的截图，明显是有左右滑动的，这里是我把代码删掉了，因为那个不是我今天要巩固的= =。接下来，就是在对应页面是N个列表list，我们需要点击每个进入他所对应的详情页，而我也是用循环写的list（就是上面的第二张图片，推荐下的list太多了，不循环会死人的偷笑），具体代码如下：
当然，最重要的一步不能忘掉。。。我们需要修改路由index.js文件： require(['components/club/itemDetail.vue'],
这样就大功告成了。两种方法，喜欢哪种用哪种就好。。以上这篇vue2中,根据list的id进入对应的详情页并修改title方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持编程之家。 （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
