Vue基础/生命周期/路由

Vue基础知识点：

1:全局的代表Vue.的

2:实例的代表this.或者new Vue().

3:选项代表new Vue()的参数或者export default里边的属性

生命周期：

生命周期函数就是vue实例在某个时间点会自动执行的函数

beforeCreate created beforeMount mounted beforeDestroy destroyed befroeUpdate updated

• beforeMount：页面还没被渲染

• mounted: 页面已经被渲染完毕

• vue实例销毁：

  • 需要调用 vm.$destroy() 方法
  • beforeDestroyed：即将被销毁
  • destroyed: 销毁完成

过滤器

• content|过滤器,vue中没有提供相关的内置过滤器，可以自定义过滤器。

• 组件内的过滤器 + 全局过滤器

  • 组件内的过滤器就是options中的一个filters的属性（一个对象）

    • 对个key就是不同的过滤器名，多个value就是与key对应的过滤方式函数体

  • Vue.filter('myFilter',function(){
           
    
    })
    

  • 全局：范围大，如果出现同名时，权力小

  • 组件内：如果出现同名时，权力大，范围小

路由 vue-router

前端路由核心：

​ 锚点值的改变，根据不同的值，渲染指定DOM位置的不同数据

ui-router：

​ 锚点值的改变，如何获取模板

vue中：

​ 模板数据不是通过ajax请求来的，而是通过函数获取模板内容

• 核心：锚点值的改变

• 看到vue开头，需要使用Vue.use

• 核心插件：

  • vue-router 路由
  • vuex 管理全局共享数据

• 使用方式：

  • 下载

    npm install vue-router --save
    

  • 在main.js中引入

    import VueRouter from 'vue-router'
    

  • 安装插件Vue.use(VueRouter)

  • 创建路由对象并配置路由规则

    let router = new VueRouter({
           
     	routes:[{
           path:'/home',component:home}]
    }