2020/5/29工作日报

上午给我们讲了一个递归，自己调用自己，可以将复杂的问题简化，而且必须有一个能结束递归的条件

例如：
function jiecheng(n) {
if(n===1) return 1;
 return n * jiecheng(n-1)
}
还可以解决斐波那锲数组
function fibonaci(n) {
 if(n<=2) return 1;
 return fibonaci(n-1)+fibonaci(n-2);
}

递归组件

实现这个跟我们封装组件差不多是一样的，通过在组件中用prop来接受传过来的数据，在组件中写逻辑和样式

vue路由

路由实现原理
浏览器url地址后面添加#/名子，如果改变哈希值，通过onhashchange可以监听到到变化
通过浏览器H5暴露的History API

vue路由懒加载
例如：const Home = () => import('../views/home.vue');
{ path: '/home', component: Home }

vue路由传参
query、params
声明式query：<router-link :to="{ name: 'user', query: { userId: 123 }}">User</router-link>
params：<router-link :to="{ name: 'user', params: { userId: 123 }}">User</router-link>

编辑式：this.router.push({ name: 'user', query: { userId: 123 }})
        this.router.push({ name: 'user', params: { userId: 123 }})

接受参数 this.$route.query(params).参数名
视图接收:
<div>User {{ $route.params(query).id }}</div>

路由守卫
router.beforeEach 注册一个全局前置守卫
路由独享守卫
{
  path: '/foo',
  component: Foo,
  beforeEnter: (to, from, next) => {
    // ...
  }
}
组件守卫
beforeRouteEnter (to, from, next) {
// 在渲染该组件的对应路由被 confirm 前调用
// 不！能！获取组件实例 `this`
// 因为当守卫执行前，组件实例还没被创建
},
 beforeRouteUpdate (to, from, next) {
// 在当前路由改变，但是该组件被复用时调用
// 举例来说，对于一个带有动态参数的路径 /foo/:id，在 /foo/1 和 /foo/2 之间跳转的时候，
// 由于会渲染同样的 Foo 组件，因此组件实例会被复用。而这个钩子就会在这个情况下被调用。
// 可以访问组件实例 `this`
},
beforeRouteLeave (to, from, next) {
// 导航离开该组件的对应路由时调用
// 可以访问组件实例 `this`
}

二级路由
{
  path: '/foo',
  component: Foo,
  children:[
    {
        path:'/erji',
        component:erji
    }
  ]
}

下午也是把封装星星组件写入到了博客中https://blog.csdn.net/dgq2739710006/article/details/106431409