today 

forof循环

//ES6中的for...of循环，遍历属性值for(let fruit of fruits){    console.log(fruit);
}

Vue动态路由：

静态路由是不可以传递参数的。需要传递参数得用到动态路由

const routes: [

    //将页面组件与path指令的路由关联
    { name: 'BookInfo', path: '/books/:id', component: BookInfo}

]

这样定义之后，vue-router就会匹配所有的：/books/1,/books/2,/books/3 ……，所以说这样定义的路由的数量是不确定的。

在<router-link> 我们加入一个 params 属性来指定具体的参数值

    　<li>
    <router-link :to ="{name:'BookInfo',params :{id:1}}" >
        <div>首页</div>
    </router-link>
</li>

这时候的链接地址

http://localhost:8080/__dirname/books/1

如果传递多个参数

如 path: '/books/version/:id'，则对应params为：params :{id:1,version:1}

大概和angularjs 的 $stateparams类似，vue 中：

$route.params

要取出参数：

<p>当前图书编号是：{{$route.params.id}}</p>

官网是这么说的：

当使用路由参数的时候，如 从/books/1 到 /books/2 ，原来的组件实例会被复用，因为两个路由都渲染同一个组件，比起销毁后再创建，复用的销率会更高。 
这也就是说 组件的生命周期钩子不会再被调用(组件没有被销毁后再创建) ，即 created mounted 等钩子函数在页面第二次加载的时候回失效

那么，当复用组件时候，想对路由参数的变化做出响应的话，就需要在 $watch 对象内添加对 $route 对象变化的跟踪函数

看到这里对这个动态路由的理解是:

貌似就是 路由带上参数而已，和aj只是实现方法不一样，不是新概念

涉及到生命周期钩子的 概念，看的时候直接跳过了， 添加 $wactch 这个在aj中 基本上就忽略的 参数，明天继续 

tomorrow

1.写ppt

2.继续vue ,elementui