vue 项目----从A页面跳转到B页面（路由跳转，用query传递id值给另一个组件）

项目效果：（吼吼~感觉蛮简单的一个效果，却摸索了两三个小时，厉害啦~）

 

 

效果要求：

        通过点击A页面列表中的查看，访问B页面的列表详情

 

效果实现：

        首先，我给A页面列表中的查看按钮添加点击事件，由于是用iview框架做的table，所以必须要清楚如何给查看按钮添加点击事件，请看截图：

        在B页面接收从A页面传递过来的当前行的id值，用 self.$route.query.id 表示，并通过后台数据接口访问该行所有数据，代码截图如下：

        最后将拿到的后台数据渲染到B页面上，请看截图：

问题分析：

        在完成这个效果的时候，没有及时和后台沟通清楚，所以，刚开始我一直在想办法得到A页面的当前点击行的数据，并用vuex或localstorage两种储存数据的方法在B页面调用，发现两个问题：1.用vue储存的数据可以成功引入B页面，当浏览器刷新时，数据就丢失了，没有继续去深究（听说可以用缓存解决这个问题，哈哈~）；2.用localstorage本地存储时，数据存在浏览器中，可以成功被B页面调用，刷新页面数据也还在，但是这样数据的安全系数不是很高，稍微懂点代码的用户可以直接在浏览器更改数据，所以这个方法直接不考虑啦~ 最后，跟后台交流的时候，发现他其实有那个列表详情的接口，还是用axios数据请求比较稳，折腾了两三个小时，终于可以啦~所以啊！遇到问题尝试用多种方法是好事，但是少不了与人的交流沟通，不然自己踩的坑就要自己爬出来，过程比较苦p，结果说不定也能终生难忘~哈哈~加油~

 

看到这里，还是忍不住啰嗦几句，不喜勿喷~（也希望能帮助大家，共勉~）