Shulou(Shulou.com)06/01 Report--

This article mainly introduces the "vue jump page commonly used methods have" related knowledge, editor through the actual case to show you the operation process, the method of operation is simple and fast, practical, hope that this article "what are the common methods of vue jump page" article can help you solve the problem.

1:router-link jumps 1. It is fine without the parameter / / name,path. It is recommended to use name / / Note: if the link in router-link starts with'/', it starts with the root route; if it does not take'/', it starts with the current route. two。 Pass parameter / / params with params parameter (similar to post) / / routing configuration path: "/ home/:id" or path: "/ home:id" / / do not configure path. The refresh page id will disappear the first time you can request it. If you configure path, the refresh page id will be retained. / / html fetch parameter $route.params.id script fetch parameter this.$route.params.id 3. Pass the parameter with query parameter / / query (similar to the parameter displayed after get,url) / / the route can not be configured / / html parameter $route.query.id script parameter this.$route.query.id2:this.$router.push () 1. No parameter this.$router.push ('/ home') this.$router.push ({name:'home'}) this.$router.push ({path:'/home'}) 2. Query passes parameter this.$router.push ({name:'home',query: {id:'123456'}}) this.$router.push ({path:'/home') Query: {id:'123456'}}) / / html fetch parameter $route.query.id script fetch this.$route.query.id 3. Params pass parameter this.$router.push ({name:'home',params: {id:'123456'}}) / / can only be configured with name// route path: "/ home/:id" or path: "/ home:id", / / do not configure path, the first request, refresh page id will disappear / / configure path Refresh page id will retain / / html fetch parameter $route.params.id script fetch parameter this.$route.params.id 4. Query and params difference query similar to get, after the jump page url will be stitched parameters, similar to? id=123456, non-important can be passed this way, password or use params refresh page id is also similar to post in params, after the jump page url will not stitch parameters, but the refresh page id will disappear. 3. This.$router.replace ()

The usage is the same as above, the same as the this.$router.push method in the second.

4. This.$router.go (n) [previous page] [next page] upPage () {this.$router.go (- 1); / / step back record, equivalent to history.back ()}, downPage () {this.$router.go (1); / / take a step forward in the browser record, equivalent to history.forward ()}

Jump forward or backward to n pages, where n can be a positive or negative integer

Ps: distinguishing this.$router.push

Jump to the specified url path and add a record to the history stack. Click back to return to the previous page.

This.$router.replace

Jump to the specified url path, but there will be no record in the history stack. Clicking back will jump to the previous page (directly replacing the current page).

This.$router.go (n)

Jump forward or backward to n pages, where n can be a positive or negative integer.

This is the end of the content about "what are the common methods for vue jump pages?" Thank you for your reading. If you want to know more about the industry, you can follow the industry information channel. The editor will update different knowledge points for you every day.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.