【6】VUE的运行环境—vue的使用

---

前言

VUE的运行环境—vue的使用

---

vue的使用

1. 组件间的传值

   1. bus --> 空Vue对象
      通过向bus对象抛出自定义事件的方式在组件间传递信息
   2. 注意事项：
      1. bus.$on()应该在组件mounted（挂载在页面上）的时候就执行
      2. this对象

2. Vue实例的生命周期钩子函数（8个）

   1. beforeCreate
      data属性光声明没有赋值的时候

   2. created
      data属性完成了赋值

   3. beforeMount
      页面上的{{name}}还没有被渲染成真正的数据

   4. mounted
      页面上的{{name}}被渲染成真正的数据

   5. beforeUpdate
      数据（data属性）更新之前会执行的函数

   6. updated
      数据（data属性）更新完会执行的函数

   7. beforeDestroy
      实例被销毁之前会执行的函数

   8. destroyed
      实例被销毁后会执行的函数

3. VueRouter
   在前端做路由的

   1. 基本使用

      1. 先写路由

      2. 生成路由实例

      3. 将路由实例挂载到Vue对象上

      4. 
         <==>

   2. 路由的模糊匹配

      1. path: ‘/user/:name’ —> $route.params.name
      2. /user/alex?age=9000 —> $route.query.age

   3. 子路由
      children

   4. 编程式导航
      用JS代码去控制页面跳转
      this.$router.push(…)

4. Vue-CLI
   一个脚手架工具，帮助我们快速的搭建Vue项目

   1. 查看本机安装的vueCLI的版本
      vue -V —> 2.9.6
   2. 使用Vue CLI创建Vue项目
      vue init webpack mysite

5. 组件中捕获原生事件
   .native修饰符