9-6#去哪儿网app#Ajax获取detail内容

将已有的json文件放入mock中，在Detail.vue中发送ajax请求。

此外，点击不同的景点，要显示不同的内容，且url变化，即要获得动态路由的参数

由于之前已经在route里定义过id，直接用这个id。生命钩子mounted和methods与之前home(或者city)中调用ajax写法基本一致。接着就是数据的相互传递。

最后有个问题，之前讲过，keep-alive做了缓存，点击别的景点的时候，没有重新发送Ajax请求，还是之前的数据。所以必须用activated钩子。

这次用另一个方法，修改根组件App.vue，添加一句exclude="Detail"：即这个页面不被缓存，问题解决。

<keep-alive exclude="Detail">
  <router-view/>
</keep-alive>

但这样的话，又有新问题，之前在header里设置的渐隐渐现的蓝色框也会消失，因为用到了activated生命钩子，暂且不管。 

思考：每个组件里name的用处。

1.递归组件可以用到

2.取消缓存，如上代码，能用到

3.chrome里的vue工具能显示每个组件的名字，取决于代码里name给的名字

还有一个问题，在某个页面向下滑动后，去往另一个页面也会在这个位置，不是在新页面的顶部，解决：在路由中添加代码：

scrollBehavior (to, from, savedPosition) {
  return { x: 0, y: 0 }
}

即进入新页面时x和y轴都为0。

Done，提交~