VUE基础笔记02

插槽

传递数据的方案，但是传递的是结构

1. 插槽内容

   <slot></slot>

2. 编译作用域
   当你想在一个插槽中使用数据时

   父级模板里的所有内容都是在父级作用域中编译的；子模板里的所有内容都是在子作用域中编译的。

3. 后备内容（插槽的默认值）
   <slot>我是插槽的默认值</slot>

4. 具名插槽
   注意 v-slot 只能添加在 <template> 上 (只有一种例外情况)，这一点和已经废弃的 slot attribute 不同。

5. 插槽作用域
  有时让插槽内容能够访问子组件中才有的数据是很有用的

动态组件和异步组件

1. 动态组件
    <!-- 失活的组件将会被缓存！-->
    <keep-alive>
      <component :is="currentComponent"></component>
   </keep-alive>

2. 异步组件

### 边界处理情况

1. 访问元素 & 组件
   $root $parent \$children

2. 全局常量 （main.js 定义之后，如果组件更改了，其他组件使用处不会响应的）

### 生命周期

创建==》渲染==》更新==》销毁

### axios

1. 处理跨域问题
   开发环境
   生产环境
   proxyTable:{
    "/api":{
    target:"http://tingapi.ting.baidu.com",
    pathRewrite:{
    '^/api':''
    },
    changeOrigin:true
    }
   }
### 路由使用

1. 创建路由对象
   const router = new VueRouter({})

2. 定义路由
   const routes = [
   {
   path: '/hello',
   component: HelloWorld,
   },
   ]
3. 路由挂载资源
   router 挂载和 routes 挂载

4. 指定路由显示位置
   <router-view></router-view>
5. 页面跳转
   <router-link></router-link>


### 动态路由匹配(路由传参)

1. 定义传递的 key
2. 传递数据
3. 接收参数