Take you to play vUE forward and backward refresh on demand!
With VUE to do background management projects, especially a list page, list data details page, list data modification page function code friends, almost all vUE forward and back are refreshed logic pit!
Old gentleman of product manager of turnip (person old white, send takeaway to come in all call old gentleman
) are:
1. When you return to the list page after entering the details page, the list cannot be refreshed, including page number and filtering conditions
2. If the data is changed, the list page is returned to the list page. The list data can be refreshed, but the page number and filtering conditions cannot be changed
3. When the non-detail page and edit page enter the list page, the list data shall be refreshed, and the page number and filtering conditions shall be reset
And give me a little face that believes you can do it
Picture description (50 words Max)
To sum up, the central idea of the old gentleman was’ This list page, if I want it to refresh, he should refresh, if I don’t want it to refresh, he should stay put and I can decide how to refresh it ‘.
I do not know how to be a good radish tears into a river, ah! No, it flows into a lake
Picture description (50 words Max)
Fold up your tears, roll up your sleeves and work hard! The first version of the fool’s operation is the list page number, filter criteria and so on back and forth between the details page and the edit page. That is a tired! And lit lit and ran off the edge.
I asked Du’s mother, and I knew there was a Keep-alive component. Yes, it is, it is, our little Nezha!
But pure keep-Alive girls don’t refresh backwards or forwards, so they need to be tweaks to keep them in line. This process requires the routing parameter meta of the routing agent to cooperate with us.
All the above are idle talk piece, can skip, below begin the topic!!
1. Set meta parameters for the destination list page in the routing file, including keepAlive and ifDoFresh fields
Picture description (50 words Max)
{ path:’*’, name:’datalist’, component: resolve => require([‘@/view/datalist’], resolve), meta:{ keepAlive: true, ifDoFresh:false } },
2. Determine whether to use the Keep-alive component based on the keepAlive field in the main.
3. In the beforeRouteEnter method of the target list page, determine the page entry method (details page, edit page, or other methods) and set the ifDoFresh field to true/ False as required.
Check whether to refresh the page by using the ifDoFresh field in the Check box that is activated (A page with keepAlive: True enabled cannot trigger Mounted on the second login).
beforeRouteEnter (to, from, next) { if(from.name! =’ details page ‘&&from.name! =’ edit page ‘) {to.meta. IfDoFresh = true; } next(); }, activated(){return value of keepAlive:true if(this){return value of keepAlive:true if(this){return value of keepAlive:true if(this);route.meta.ifDoFresh = false; This.getdata (true); this.getData(true); }else{ this.getData(); }}
So, the end!
Add Java Architect advanced communication group to get Java engineering, high performance and distributed, high performance, easy to understand. High architecture. Performance tuning, Spring, MyBatis, Netty source analysis and big data and other knowledge points of advanced advanced dry live free learning rights are danniu belt fly let you walk a lot less detour group number is: 810309655 for the small white do not enter the best is to have development experience
Note: Add group requirement
1. Those with work experience, who do not know where to start in the face of the current popular technology and need to break the technical bottleneck can be added.
2. I have been in the company for a long time and have been comfortable, but I hit a wall in the interview when I changed my job. Need to study in a short period of time, job-hopping can be added.
3. If you have no working experience, but have a solid foundation, and have a good command of Java working mechanism, common design ideas and common Java development framework, you can add.
4, feel very good B, general needs can be done. But the knowledge points learned are not systematic, it is difficult to continue to break through in the field of technology can be added.
5. Ali Java senior bull live explain knowledge points, share knowledge, sorting out and summarizing years of work experience, with everyone to establish their own technical system and technical knowledge in a comprehensive and scientific way!