vue- important method

当页面正在方位是触发router-link-exact-active

Use a tab page will jump, not a single-page operation, so use this tag router-link to = page not Jump

vue-router配置路由:
    <router-link to=""></router-link> | this.$router.push() 完成跳转
    <router-view /> 完成页面组件的占位
    在router/index.js中 完成路由配置 路径-视图组件 映射关系
    两种路由传参
    配置              跳转              获取
    path:'/user'     to="/user?pk=1"   $route.query.pk
    path:'/user/:pk' to="/user/1"      $route.params.pk
    
    :to="{name:'user'}"  #如同Django中的路由反向解析

require global style configuration, the configuration in main.js

Configuring global style: official advocate require load static files; @ represents the absolute path to the src folder

vue project life cycle:

1, start the project, the main script file to load main.js
loaded Vue environment, create the root component for rendering to finish
loading system existing third-party environment: router, store
loading third-party environment with their environment custom configuration: With the increase in project keep adding

2, router is loaded, it will parse the router index.js script file folders, complete route - mapping between components

3, the new assembly .vue view (in the views folder), arranged in the route (in index.js router's), set the routing jumps (Nav.vue navigation bar assembly)

vue hook life cycle

Lifecycle hook:

  • 1) method to create a component from the destruction of many nodes callback time
  • 2) Examples of these methods are the members of the assembly vue
  • 3) the role of the life cycle of the hook is to meet at different times of nodes something needs to be done
  • Hook component life cycle: assembly from creation to destroy the entire life cycle of the method in a specific callback time node
    created () {} complete background data request ==> (this method is used more generally where the rear end load passes the leading end of data)
    Mounted () {extremely time-consuming to complete the requested data back}

vue routing knowledge Overview

'''
路由知识点概况:
    1)路由配置:router/index.js
    2)路由跳转与路由渲染:router-link、router-view、$router.push、$router.go
    3)路由传参:两种传参
'''

1, in the router

2, the jump route

Guess you like

Origin www.cnblogs.com/mqhpy/p/12074676.html