How to jump from page A to page B by vue
This article introduces the relevant knowledge of "how vue can jump from page A to page B". In the operation of actual cases, many people will encounter such a dilemma, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!
This article operating environment: windows7 system, Vue2.9.6 version, DELL G3 computer.
How does vue jump from page A to page B?
Vue jumps from interface A to interface B and carries parameters
Recently there is a requirement that you need to jump from interface A to interface B by clicking a button with parameters.
This is how I fulfilled my needs:
A page:
{{$t ('common.add')}} {{$t (' common.edit')}}
Click event:
Add () {this.lockTaskStatus = 'new' this.toLockTaskManagePage ()}, edit () {this.lockTaskStatus =' edit' this.toLockTaskManagePage ()}, toLockTaskManagePage () {this.$router.push ({path:'/ taskLockManage', name: 'TaskLockManage', params: {status: this.lockTaskStatus}})}
Add the jumped url to $router.
The url in path is preceded by / in the root directory, and if it is not added, it is a child route.
Parameters are passed through the combination of path + params.
Page B:
Created () {this.getParams ()}, watch: {/ / monitor routing changes. Call the method to obtain routing parameters to store the data in this component $route: 'getParams'}, methods: {getParams () {/ / get the parameter const res = this.$route.params.status console.log (' getParams', res)}} brought by the route
Finally, you need to register with router/index.js:
{path:'/ taskLockManage', component: Layout, redirect:'/ taskManage/index', hidden: true, children: [{path: 'taskLockManage', component: () = > import (' @ / views/taskManage/taskLockManage'), name: 'TaskLockManage', meta: {title:' taskLockManage', icon: 'user', noCache: true}]}
In this way, the jump can be realized. PS: this is a better method that has been found so far. I hope which boss has a better method to guide. )
This is the end of the content of "how to jump from page A to page B in vue". Thank you for reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!