Talking about the difference vue $ router and $ route of

Vue recent study of single-page application development needs vue family bucket, which uses a VueRouter, met two objects $ router and $ route in the routing settings and jump, some innocently tell, combined with online Later the blog and its local Vue devtools structure to understand the difference between them

1.router is an object of VueRouter, get an instance of an object through a router Vue.use (VueRouter) and VueRouter constructor, this object is a global object, it contains all the key routing contains many objects and attributes .

For example: history objects

$ Router.push ({path: 'home'}); essentially add a route to the history stack, in our view is the switching route, but the essence is added in a history record

method:

$ Router.replace ({path: 'home'}); // alternate route, no history

2.route routing object is a jump, each route will have a route object that is a partial object can acquire the corresponding name, path, params, query, etc.

We can see different routes each object from the vue devtools

These two different structures can be seen in the difference between the two, some of their properties are different.

    • $ route.path 
      string object is equal to the current routing path, it may be resolved to an absolute path, such as  "/home/news" .
    • $ route.params 
      objects, comprising a routing key and dynamic segment of the full-match fragment
    • $ route.query 
      object containing key route query parameters right. For example, for  /home/news/detail/01?favorite=yes , you get $route.query.favorite == 'yes' .
    • $ route.router 
      router (and the components to which it belongs) routing rule belongs.
    • $ route.matched 
      array configuration parameter object contains all the segments matching the current paths contained in the corresponding.
    • $ route.name 
      name of the current path, if no path named, the name is empty.

$route.path, $route.params, $route.name, $route.queryThese attributes is easy to understand, look at the example they represent will be able to know the meaning of 

Turn: https://www.cnblogs.com/czy960731/p/9288830.html

http://www.hailungangqin.cn 

http://www.werdaa.com/atricle/173.htm
http://www.werdaa.com/atricle/174.htm
http://www.werdaa.com/atricle/175.htm
http://www.werdaa.com/atricle/176.htm
http://www.werdaa.com/atricle/177.htm
http://www.werdaa.com/atricle/178.htm
http://www.werdaa.com/atricle/179.htm
http://www.werdaa.com/atricle/180.htm
http://www.werdaa.com/atricle/181.htm
http://www.werdaa.com/atricle/182.htm
http://www.werdaa.com/atricle/183.htm
http://www.werdaa.com/atricle/184.htm
http://www.werdaa.com/atricle/185.htm
http://www.werdaa.com/atricle/186.htm
http://www.werdaa.com/atricle/187.htm
http://www.werdaa.com/atricle/188.htm
http://www.werdaa.com/atricle/189.htm
http://www.werdaa.com/atricle/190.htm
http://www.werdaa.com/atricle/191.htm

Guess you like

Origin www.cnblogs.com/zjw2004112/p/11606467.html