WO2023169215A1 - 页面显示方法、装置、存储介质及电子设备 - Google Patents

页面显示方法、装置、存储介质及电子设备 Download PDF

Info

Publication number
WO2023169215A1
WO2023169215A1 PCT/CN2023/077733 CN2023077733W WO2023169215A1 WO 2023169215 A1 WO2023169215 A1 WO 2023169215A1 CN 2023077733 W CN2023077733 W CN 2023077733W WO 2023169215 A1 WO2023169215 A1 WO 2023169215A1
Authority
WO
WIPO (PCT)
Prior art keywords
page
parameter
jump
parent
string
Prior art date
Application number
PCT/CN2023/077733
Other languages
English (en)
French (fr)
Inventor
刘江波
Original Assignee
京东方科技集团股份有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 京东方科技集团股份有限公司 filed Critical 京东方科技集团股份有限公司
Publication of WO2023169215A1 publication Critical patent/WO2023169215A1/zh

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs
    • G06F9/448—Execution paradigms, e.g. implementations of programming paradigms
    • G06F9/4482—Procedural
    • G06F9/4484—Executing subprograms
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/20—Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
    • G06F16/24—Querying
    • G06F16/245—Query processing
    • G06F16/2455—Query execution
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/38—Creation or generation of source code for implementing user interfaces
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs
    • G06F9/451—Execution arrangements for user interfaces

Definitions

  • the present disclosure relates to the field of computer technology, and specifically, to a page display method, a page display device, a computer-readable storage medium, and an electronic device.
  • Vue is a progressive framework for building user interfaces. Based on the Vue framework, front-end pages can be quickly developed, such as the development of single-page applications.
  • jumping between pages will cause the page to refresh. Take the jump between the list page and the details page as an example. After selecting a certain data from the filtered list page and jumping to the details page of the data, when returning to the list page from the details page, it will return to the initial state of the list page. , without saving the query results after the last filtering. If the user needs to view the query results, the filtering operation needs to be performed again, which reduces the user experience.
  • the present disclosure provides a page display method, page display device, computer-readable storage medium and electronic equipment.
  • the present disclosure provides a page display method, including:
  • the method before jumping from the parent page to the sub-page corresponding to the target data, the method further includes:
  • Configure a target file which is used to store the parent-child relationship between the parent page and the child page.
  • the method before jumping from the parent page to the sub-page corresponding to the target data, the method further includes:
  • the first parameter memory variable is used to mark whether to memorize the page jump parameter of the parent page;
  • a first navigation guard which is used to assign values to the path attributes of the parent page and the path attributes of the child pages in the first object, and determine that the first object exists in the first object by traversing the target file.
  • assign a value to the first parameter memory variable corresponding to the parent page in the first object When the page is in the target file, assign a value to the first parameter memory variable corresponding to the parent page in the first object.
  • a first request is sent to the server to store the page jump parameters of the parent page, and from the The parent page jumps to the sub-page corresponding to the target data, including:
  • converting the page jump parameter into a target parameter string includes:
  • the method before jumping back from the child page to the parent page, the method further includes:
  • the second parameter memory variable is used to mark whether there is a page jump parameter of the parent page in the target file
  • the second navigation guard is used to assign values to the path attributes of the parent page and the path attributes of the child pages in the second object, and determine that the second object exists in the second object by traversing the target file.
  • assign a value to the second parameter memory variable corresponding to the parent page in the second object When the page is in the target file, assign a value to the second parameter memory variable corresponding to the parent page in the second object.
  • the second request is sent to the server to obtain the page jump parameter of the parent page, and jumps from the child page according to the page jump parameter.
  • the parent page including:
  • Decode the first parameter string to obtain the initial parameter string, and convert the initial parameter string into the page jump parameter of the parent page;
  • jumping back from the child page to the parent page according to the page jump parameter includes:
  • the present disclosure provides a page display device, including:
  • the first page display module is configured to send a first request to the server to store the page jump parameters of the parent page when receiving a query operation for the target data in the parent page, and jump from the parent page to the The subpage corresponding to the target data;
  • the second page display module is configured to send a second request to the server to obtain the page jump parameter of the parent page, and jump from the sub-page back to the parent page according to the page jump parameter.
  • the present disclosure provides a computer-readable storage medium on which a computer program is stored.
  • a computer program is stored on which a computer program is stored.
  • the computer program is executed by a processor, any one of the methods described above is implemented.
  • the present disclosure provides an electronic device, including: a processor; and a memory for storing executable instructions of the processor; wherein the processor is configured to perform any of the above by executing the executable instructions. method described.
  • Figure 1 shows a schematic diagram of an exemplary system architecture in which a page display method and device according to embodiments of the present disclosure can be applied;
  • Figure 2 schematically shows a flow chart of a page display method according to one embodiment of the present disclosure
  • Figure 3 schematically shows a flow chart for storing page jump parameters when page jumps according to an embodiment of the present disclosure
  • Figure 4 schematically shows a flowchart of processing page jump parameters when page jumps according to an embodiment of the present disclosure
  • Figure 5 schematically shows a flow chart for storing page jump parameters when page jumps according to another embodiment of the present disclosure
  • Figure 6 schematically shows a flow chart for obtaining page jump parameters when the page returns according to an embodiment of the present disclosure
  • Figure 7 schematically shows a flow chart for obtaining page jump parameters when the page returns according to another embodiment of the present disclosure
  • Figure 8 schematically shows a complete flow chart of a page display method according to one embodiment of the present disclosure
  • Figure 9A schematically shows a schematic diagram of an original list page according to one embodiment of the present disclosure.
  • Figure 9B schematically shows a schematic diagram of an intermediate list page according to one embodiment of the present disclosure.
  • Figure 9C schematically shows a schematic diagram of a work order details page according to one embodiment of the present disclosure.
  • Figure 10 schematically shows a block diagram of a page display device according to an embodiment of the present disclosure
  • FIG. 11 schematically shows a structural diagram of a computer system suitable for implementing an electronic device according to an embodiment of the present disclosure.
  • Example embodiments will now be described more fully with reference to the accompanying drawings.
  • Example embodiments may, however, be embodied in various forms and should not be construed as limited to the examples set forth herein; rather, these embodiments are provided so that this disclosure will be thorough and complete, and will fully convey the concepts of the example embodiments.
  • the described features, structures or characteristics may be combined in any suitable manner in one or more embodiments.
  • numerous specific details are provided to provide a thorough understanding of embodiments of the disclosure.
  • those skilled in the art will appreciate that the technical solutions of the present disclosure may be practiced without one or more of the specific details described, or other methods, components, devices, steps, etc. may be adopted.
  • well-known technical solutions have not been shown or described in detail to avoid obscuring aspects of the disclosure.
  • FIG. 1 shows a schematic diagram of the system architecture of an exemplary application environment in which a page display method and device according to embodiments of the present disclosure can be applied.
  • the system architecture 100 may include one or more of terminal devices 101, 102, 103, a network 104 and a server 105.
  • the network 104 is a medium used to provide communication links between the terminal devices 101, 102, 103 and the server 105.
  • Network 104 may include various connection types, such as wired, wireless communication links, or fiber optic cables, among others.
  • the terminal devices 101, 102, and 103 can be various electronic devices, including but not limited to desktop computers, portable computers, smart phones, tablets, etc., and are used to provide user interfaces for page display.
  • a client such as a browser
  • the page can be browsed through the browser client.
  • the browser on the terminal device can be used to perform: when receiving a query operation for the target data in the parent page, send a first request to the server to store the page jump parameters of the parent page, and retrieve the page jump parameters from the parent page.
  • the parent page jumps to the sub-page corresponding to the target data; sends a second request to the server to obtain the page jump parameter of the parent page, and jumps from the sub-page according to the page jump parameter Return to the parent page.
  • the number of terminal devices, networks and servers in Figure 1 is only illustrative. Depending on implementation needs, there can be any number of end devices, networks, and servers.
  • the server 105 may be one server, a server cluster composed of multiple servers, or a cloud computing platform or virtualization center.
  • the server 105 can be used to provide background services for view components that support page display, etc.
  • the page display method provided by the embodiment of the present disclosure is generally performed by one or more of the terminal devices 101, 102, and 103. Execution, correspondingly, the page display device is generally provided in the terminal equipment 101, 102, 103. For example, after execution by the terminal equipment, the last query result can be directly displayed on the display screen of the terminal equipment. In this exemplary embodiment There are no special restrictions on this. However, those skilled in the art can easily understand that the page display method provided by the embodiment of the present disclosure can also be executed by the server 105.
  • the page display device can also be set in the server 105, and the server can store the query conditions selected by the user. This is so that when the page jumps, the last query result can be returned according to the query condition, and the terminal device can display it to the user.
  • Vue is a progressive framework for building user interfaces. Based on the Vue framework, front-end pages can be quickly developed, such as the development of single-page applications.
  • jumping between pages will cause the page to refresh. Take the jump between the list page and the details page as an example. After selecting a certain data from the filtered list page and jumping to the details page of the data, when returning to the list page from the details page, it will return to the initial state of the list page. , without saving the query results after the last filtering. If the user needs to view the query results, the filtering operation needs to be performed again, which reduces the user experience.
  • this example implementation provides a page display method, which can be applied to one or more of the above terminal devices 101, 102, 103, and can also be applied to the above server 105.
  • the page display method may include step S210 and step S220:
  • Step S210 When receiving a query operation for the target data in the parent page, send a first request to the server to store the page jump parameters of the parent page, and jump from the parent page to the page corresponding to the target data. Subpage;
  • Step S220 Send a second request to the server to obtain the page jump parameter of the parent page, and jump back to the parent page from the child page according to the page jump parameter.
  • a first request is sent to the server to store the page jump parameters of the parent page, and the page jump parameters are retrieved from the parent page.
  • the parent page jumps to the sub-page corresponding to the target data; sends a second request to the server to obtain the page jump parameter of the parent page, and jumps from the sub-page according to the page jump parameter.
  • this disclosure allows the server to store page jump parameters when entering a subpage from a parent page. When returning from a subpage, the page jump parameters can be obtained from the server and the previous parent page can be restored based on the page jump parameters.
  • step S210 when receiving a query operation for the target data in the parent page, a first request is sent to the server to store the page jump parameters of the parent page, and jump from the parent page to the target data. the corresponding subpage.
  • page display in a single-page application can be used as an example for explanation.
  • the parent page can be a list page
  • the child page can be a details page.
  • a single-page application refers to an application with only one main page. When the application is run in the browser, the system only needs to load resources once. Subsequent operation interaction and data interaction are through Router (routing), AJAX (Asynchronous Javascript) And XML, a web development technology for creating interactive web applications) implementation.
  • the list page and detail page can be user interfaces developed by the Vue-Cli framework.
  • the list page can be a user interface used to display highly repetitive interface elements in the application, and the order, position, and data source of each interface element can be controlled through the Vue-Cli framework.
  • a details page can be a user interface in an application that displays detailed content for an interface element.
  • query conditions may include filtering conditions and paging conditions.
  • the filtering conditions can be information such as name, type, etc.
  • the paging conditions can be information such as page number, number of data items per page, etc. For example, if the user searches based on type in the list page, and the filter condition of the list page is "alarmType:1", it can mean to search for data whose alarm type is type 1 in the list page.
  • the list page may include an original list page and an intermediate list page.
  • the original list page can be the initial state of the list page
  • the intermediate list page can be a list page with both filtering conditions and paging conditions.
  • the filtering condition such as alarmType: 1
  • the original list page can be switched to the middle list page, that is, the second page, according to the paging condition (such as pageNum: 2).
  • the corresponding query condition is: "alarmType: 1, pageNum: 2". It is understandable that the original list page can default to the first page of data without filtering conditions, and the corresponding query conditions are "alarmType:", pageNum:1".
  • the parent page may be an original list page or an intermediate list page, that is, the data in the original list page may be queried in detail, or the data in the intermediate list page may be queried in detail.
  • the data in the intermediate list page may be queried in detail.
  • a request can be sent to the server to store the page jump parameters of the intermediate list page.
  • the page can be jumped.
  • the transfer parameters are stored in the database, and the intermediate list page jumps to the details page corresponding to the target data.
  • the page jump parameter can be the query condition carried by the intermediate list page
  • the target data can be any list data associated with the details page in the intermediate list page
  • the details page can be the third page displayed when querying the details of the target data.
  • the request sent to the server can be an http (hypertext transfer protocol) request.
  • the page jump parameters of the intermediate list page can be sent to the server through the first request such as a post request, so that The server stores the received page jump parameters of the intermediate list page in the database.
  • a target file can be pre-configured, and the target file can be used to store all parent-child relationships between the parent page and the child pages.
  • the corresponding target file can be a JS (Java Script, scripting language) file configured in the Vue-store (storage folder).
  • JS Java Script, scripting language
  • Vue-store storage folder
  • a pageJumpMemory.js file is used to describe all pages in the application that have a parent-child relationship.
  • the data in this file can form an array of configuration items, and the array can be used as a global variable and only needs to be loaded once when the project is started. , to pull all configuration information in the file and store all configuration information in store state management for subsequent global calls.
  • the parent-child relationship of all pages in the pageJumpMemory.js file can be configured and stored in the form of a table.
  • the table can be updated accordingly. For example, if the web application adds a new parent-child relationship page during the iteration process, the new parent-child page can be added to the table to achieve timely updates of the web application.
  • Table 1 the table used to store the parent-child relationship of the page in the configured pageJumpMemory.js file is schematically given.
  • parent page 1 path attribute value: /fatherPage1/index
  • child page 1 path attribute value: /fatherPage1/son1
  • parent page 2 path attribute value: /fatherPage2 /index
  • child page 2 path attribute value: /fatherPage2/son1
  • the first parameter memory variable that is, requireMemory.
  • the first navigation guard that is, the beforeRouteLeave hook function.
  • This guard can be used to assign values to the path attributes of the parent page and the path attributes of the subpages in the first object, and to determine that the first object exists in the target by traversing the target file. file, you can assign a value to the first parameter memory variable corresponding to the parent page in the first object.
  • three parameters need to be passed in, namely to, from and next.
  • the parameter to (Route, routing attribute) represents the target routing object that is about to enter
  • the parameter from (Route, routing attribute) represents the routing object that the navigation is about to leave.
  • the route jump is executed by calling the next function. The execution effect depends on the next function. the calling parameters.
  • the path attribute value of the parameter to can be assigned to temp.son
  • the path attribute value of the parameter from can be assigned to temp.father.
  • the configured pageJumpMemory.js file can then be traversed to determine whether the temp object exists in the file.
  • the first parameter memory variable requireMemory will be assigned the value true; if the temp object does not exist in the pageJumpMemory.js file, the first parameter memory variable requireMemory will be assigned the value false .
  • jumping from the parent page to the subpage corresponding to the target data can be implemented according to steps S310 to S330.
  • Step S310 When receiving a query operation for the target data in the parent page, obtain the page jump parameter and the first parameter memory variable of the parent page.
  • the parent page is the intermediate list page and the child page is the details page.
  • the beforeRouteLeave hook function can be triggered to call the page jump function, and the page jump function can be used to transfer data from the intermediate list page to the intermediate list page.
  • the query operation may be the user's click/short press operation on the "Details" control on the intermediate list interface, which is not specifically limited in this disclosure.
  • the page jump function can be the toDetails function.
  • the page jump parameters that is, the query conditions carried by the intermediate list page can be stored through the server, so as to facilitate When returning from the details page, the query conditions can be obtained from the server, and the last query results can be restored based on the obtained query conditions. There is no need for the user to filter the original list page again, which can improve the user experience.
  • the query condition is to filter the original list page according to the filter condition "alarmType is 1", and then switch from the original list page to the intermediate list page according to the paging condition "second page, each page contains 10 data" to query the intermediate list page.
  • the options passed in corresponding to the query condition can be ⁇ pageNum: 2, pageSize: 10, alarmType: 1 ⁇ .
  • Step S320 When the page jump function is used to determine that the first parameter memory variable meets the preset condition, convert the page jump parameter into a target parameter string.
  • the page jump parameters can be processed according to steps S410 to S430 to store the processing results.
  • Step S410 When the page jump function is used to determine that the first parameter memory variable value is the target value, convert the page jump parameter into an initial parameter string.
  • the page jump function can be used to determine whether the first parameter memory variable requireMemory meets the preset condition.
  • the preset condition can be that the value of the first parameter memory variable is the target value true, so that the page jump is performed based on the value of requireMemory.
  • the page jump parameters can be converted into initial parameter strings.
  • the page jump parameters can be the query condition options carried by the intermediate list page, and the initial parameter string can be the params string. It should be noted that the purpose of converting the page jump parameters into parameter strings is to convert the page jump parameters into content that can be uniformly recognized by the page jump function, so as to facilitate unified and integrated management and operation.
  • the toDetails function can be used to convert the options object into a params string. If the options are ⁇ pageNum:2, pageSize:10, alarmType:1 ⁇ , the converted params string can be ⁇ "pageNum”:2,” pageSize”:10,”alarmType”:1 ⁇ , as shown in Table 2.
  • Step S420 Encode the initial parameter string to obtain a first parameter string.
  • the initial string can be encoded to obtain the first parameter string.
  • the toDetails function can be used to convert the options object into a params string, and the params string is the initial parameter string.
  • the encoded params string is the first parameter string.
  • the encodeURI function can encode strings as URI components.
  • the encoded params string can be: "%7BpageNum%3Apagesize%22", as shown in Table 3.
  • Step S430 Encrypt the first parameter string to obtain the target parameter string.
  • the encoded first parameter string can also be encrypted to obtain the target parameter string.
  • the options object can be converted into a params string using the toDetails function, and the params string is the initial parameter string.
  • the encoding result of the params string can be Base64 encoded to encrypt the encoding result of the params string.
  • the encryption method can also be MD5 (message-digest algorithm 5, message-digest algorithm), SHA1 (Secure Hash Algorithm 1, secure hash algorithm 1), Crypto-JS (a JavaScript encryption algorithm), etc., This disclosure does not specifically limit this.
  • the encoded params string is the first parameter string
  • the encrypted params string is the target parameter string.
  • the encrypted params string can be "cGFnZU51bTo1LCBw", as shown in Table 4.
  • Step S330 Send the first request carrying the target parameter string to the server to store the target parameter string on the server, and jump from the parent page to the child corresponding to the target data. page.
  • a first request such as a post request to the server.
  • the post request can carry the target parameter string to send the target parameter string to the server, and pass the target parameter through the server.
  • the string is stored to realize the storage function of the query conditions of the intermediate list page.
  • the next function can be called through the beforeRouteLeave hook function to perform a page jump based on the path attribute value of the intermediate list page and the path attribute value of the details page, thereby jumping from the intermediate list page to the details page corresponding to the target data.
  • page jump can also be implemented according to step S501 to step S506.
  • Step S502. Convert options into params string
  • Step S503. Encrypt the params string
  • Step S504. Encode the encrypted params string
  • Step S505. Send the encoded params string to the server through the post request for storage;
  • Step S506. Jump to the target page.
  • Page jump parameters can be used to store the query conditions of the parent page when the page jumps, so that the query conditions can be obtained when returning from the sub-page, and the last query results can be restored based on the obtained query conditions without modifying the source code of the sub-page. It reduces the user's workload and improves the user's page operation efficiency. Moreover, by sending a request to the server, the query conditions of the parent page can be stored in the database, without using memory to store data, reducing memory consumption and thus improving the display performance of the page.
  • step S220 a second request is sent to the server to obtain the page jump parameter of the parent page, and jumps back from the child page to the parent page according to the page jump parameter.
  • an option variable defaultParams can be defined, and the option variable can be used to save the default value of the page jump parameter. For example, it can be used to save the initial query conditions of the list page. If the initial query conditions are ⁇ pageNum:1,pageSize:10 ⁇ , it means that each page contains ten pieces of data by default, and the data on the first page will be taken for display. When entering the list page, defaultParams will be used as the query condition by default and the corresponding list data will be obtained. It can be understood that when the query condition of the list page is the initial query condition, what is displayed is the initial state of the list page, that is, the original list page.
  • the Vue framework is used to implement the page display of a single-page application. Therefore, before jumping back from the child page to the parent page, that is, before returning from the details page to the intermediate list page, a second parameter memory variable can also be defined, That is, hasMemory. This second parameter memory variable can be used to mark whether there is a page jump parameter of the parent page in the target file.
  • hasMemory false
  • the path attribute value of the parameter to can be assigned to temp2.son
  • the path attribute value of the parameter from can be assigned to temp2.father.
  • the configured pageJumpMemory.js file can then be traversed to determine whether the temp2 object exists in the file.
  • the second parameter memory variable hasMemory will be assigned to true; if the temp2 object does not exist in the pageJumpMemory.js file, the second parameter memory variable hasMemory will be assigned to false .
  • the user When the user queries the details of a certain data in the intermediate list page, he can jump from the intermediate list page to the details page of the data.
  • defaultParams When returning from the details page, defaultParams will be used as the query condition, and the original query condition will be obtained according to the initial query condition.
  • the list data of the list page means that you can jump back to the original list page from the details page.
  • the user can call the parameter parsing function and use parameter parsing The function returns the list page that retains the last query results from the details page, that is, returns to the intermediate list page.
  • the parameter parsing function may be the getMemoryParams function.
  • the beforeRouteEnter hook function can be triggered to call the getMemoryParams function
  • the getMemoryParams function can be used to complete the acquisition and parsing of the last query conditions before entering the list page. This makes it easy to modify the value of defaultParams based on the parsing results, and then restore the last query results. There is no need for the user to filter the list page again, which improves the user experience.
  • the beforeRouteEnter hook function to call the getMemoryParams function before entering the intermediate list page, and send a request to the server through the getMemoryParams function to obtain the page jump parameters of the intermediate list page, and based on the page Jump parameters return to the intermediate list from the details page page.
  • the request sent to the server may be an http request.
  • a second request such as a get request may be sent to the server, so that the server returns the page jump parameters of the intermediate list page.
  • steps S610 to S630 can be used to jump from the subpage back to the parent page that retains the last query results. For example, you can jump from the details page back to the intermediate list page.
  • Step S610 When the parameter parsing function is used to determine that the second parameter memory variable value is the target value, send a second request to the server to obtain the target parameter string from the server.
  • reg is a regular expression
  • reg can be used to match the details page URL corresponding to the current list page.
  • to, from and next can be obtained from the beforeRouteEnter hook function.
  • to and from are both object type data. You can get the information of the list page through to, and you can get the information of the page before entering the list page through from.
  • Next is a jump function.
  • the beforeRouteEnter hook function requires that the next function must be called after the business code is executed, which is used to mark the completion of the function and enter the page loading process.
  • getMemoryParams function After the parameter transfer is completed, you can use the getMemoryParams function to obtain the target parameter string. For example, when returning from the details page, you can first use the getMemoryParams function to check whether the query conditions of the intermediate list page are stored in the database. For example, when the second parameter memory variable value hasMemory is the target value true, it indicates that there is a page jump parameter for the intermediate list page in the database, and a second request such as a get request can be sent to the server to obtain the target parameter from the server. String.
  • Step S620 Decrypt the target parameter string to obtain the first parameter string.
  • the target parameter string can be parsed to obtain the page jump parameters. For example, when jumping from the intermediate list page to the details page, the options object is first converted into a params string, then the encodeURI function is used to encode the params string, and the encoding result of the params string is Base64-encoded and encrypted. The encoding result of the params string is the params string "cGFnZU51bTo1LCBw.".
  • Step S630 Decode the first parameter string to obtain the initial parameter string, and convert the initial parameter string into a page jump parameter of the parent page.
  • the first parameter string can be decoded to obtain the initial parameter string, and the initial parameter string can be converted into a page jump parameter of the intermediate list page.
  • the decoded The params string ⁇ "pageNum”:2,”pageSize”:10,”alarmType”:1 ⁇ is the initial parameter string.
  • the params string can be restored to the object type data options ⁇ pageNum:2,pageSize:10,alarmType:1 ⁇ .
  • the target parameter string is the params string "%7BpageNum%3Apagesize%22"
  • Step S640 Jump back from the child page to the parent page according to the page jump parameter.
  • the option variable defaultParams After extracting the page jump parameters, you can assign the current value of the page jump parameters to the option variable defaultParams to jump from the details page back to the intermediate list page based on the assigned option variable. For example, after the assignment is completed, the option variable defaultParams changes from the initial query condition ⁇ pageNum:1, pageSize:10 ⁇ to options ⁇ pageNum:2, pageSize:10, alarmType:1 ⁇ , and the intermediate list is entered by calling next() page, that is, jumping from the details page back to the list page that retains the last query results.
  • page jump parameters stored in the database can be deleted so that there are only 0 or 1 records in the database table. , greatly reducing the storage pressure on the database.
  • page jump parameters can be deleted through a delete request.
  • the specific implementation method of deleting page jump parameters can be changed according to specific implementation scenarios, and this disclosure does not specifically limit this.
  • jumping from the details page back to the list page can be implemented according to steps S701 to S708.
  • Step S701. Verify whether the list page and the details page exist in the pageJumpMemory.js file. If yes, step S702 is executed. If not, the page jump is not from the specified details page back to the intermediate list page, or the page jump parameter of the intermediate list page does not exist in the database, then step S707 is executed;
  • Step S702. Send a get request to the server to obtain the params string
  • Step S703. Decode the params string
  • Step S704. Decrypt the decoded params string
  • Step S705. Convert the decrypted params string into an options object
  • Step S706 Assign options to defaultParams
  • Step S708. Use defaultParams to request list data, render the list data and provide it to the user through the terminal device. row display.
  • two steps are required to retain the last query result when returning to the list page from the details page: first, before leaving the list page, call the page jump function (such as toDetails) in the list page beforeRouterLeave hook function Function) determines whether the query conditions of the current page need to be memorized. If memory is needed, a post request is sent to the server to store the query conditions. Among them, the query conditions have been base64 encoded before sending the post request to the server, which can ensure the security of the request; secondly, before entering the list page, call the parameter parsing function (such as the getMemoryParams function) in the beforeRouteEnter hook function of the list page ) Determine whether the query conditions of the list page exist.
  • the page jump function such as toDetails
  • the list page beforeRouterLeave hook function Function determines whether the query conditions of the current page need to be memorized. If memory is needed, a post request is sent to the server to store the query conditions. Among them, the query conditions have
  • page display can be performed according to steps S801 to S807.
  • Step S801. Configure the parent-child page relationship. Configure the pageJumpMemory.js file in the browser's Vue-store to store and maintain the parent-child relationship page, and whether it is necessary to remember the page jump parameters of the parent page;
  • Step S802 Before page jump, assign a value to the first parameter memory variable. Determine whether the current page and the target page exist in the pageJumpMemory.js file. If they exist, assign the value of true to the first parameter memory variable. Otherwise, assign the value of false to the first parameter memory variable;
  • Step S803 When the page jumps, send a post request to the server to store the page jump parameters according to the first parameter memory variable.
  • the encoded page jump parameters can be sent to the server through a post request, so that the server can store the page jump parameters in the database;
  • Step S804. The server receives the post request sent by the browser and stores the page jump parameters in the database
  • Step S805. When the page returns, send a get request to the server to obtain the page jump parameters;
  • Step S806 The server receives the get request sent by the browser, obtains the page jump parameters from the database, returns the page jump parameters to the browser, and promptly clears the page jump parameters stored in the database;
  • Step S807 Decode the obtained page jump parameter, and request corresponding data according to the decoding result to re-render the browser page.
  • the server can store the page jump parameters when entering the child page from the parent page.
  • the page jump parameters can be obtained from the server and the previous parent page can be restored based on the page jump parameters.
  • page which avoids page refresh due to page jumps. Users can obtain the last query results without operating again, thus improving user experience; on the other hand, page jump parameters can be stored through interaction with the server. and acquisition, there is no need to use memory to store data, which reduces memory consumption and thus improves the display performance of the page.
  • FIG. 9A a list page displayed at runtime by an application for operation and maintenance services is schematically provided. noodle. It can be seen that Figure 9A shows the initial state of the list page, that is, the original list page, and the corresponding query conditions are "name:", pageNum:1", which is the first page of data without filtering conditions.
  • This list page It includes 6 pieces of list data. Each piece of list data includes the work order number, work order name and work order status. For example, the first list data is the test work order with work order number 202101, and the current status of the work order is resolved. . It can be understood that each piece of list data in the list page can be used as target data.
  • the user can perform the "View Details" operation corresponding to the work order to Enter the details page of the work order from the current list page. For example, when you click "View Details", you can trigger the beforeRouteLeave hook function and call the toDetails function through the beforeRouteLeave hook function to use the toDetails function to jump from the current list page to the work order.
  • the details page stores the query conditions of the current list page through the server. Among them, "work order number”, "work order name” and “work order status” can be used as filtering conditions, and the page number and 6 data per page can be used as paging Conditions.
  • users can also directly select the target page number to go to the corresponding intermediate list page.
  • FIG. 9B a list page with filtering conditions and paging conditions is schematically provided, that is, an intermediate list page. It can be seen that the query condition corresponding to this list page is "name: no intrusion, pageNum: 6".
  • the six list data in Figure 9B are all no intrusion work orders, and each list data can be used as target data.
  • the user can jump from the list page shown in Figure 9B to the details page corresponding to the list data.
  • the user selects the no-intrusion work order with work order number 202131 and performs the view details operation, he can enter the details page of the work order from the current list page, for example, he can enter the details page as shown in Figure 9C.
  • the details page includes 6 detailed data, including work order name, work order number, work order status, creator, creator contact information, creation time and related pictures.
  • the beforeRouteLeave hook function, beforeRouteEnter hook function, page jump function, parameter parsing function and option variables can be encapsulated into executable files in advance and stored in the browser, so that when receiving This executable file is executed when querying the target data in the list page.
  • the executable file can also include source codes for parameters to, reg, from and next, as well as algorithm source codes for encoding and encryption, etc. That is, the source code can be encapsulated according to the actual needs of the user and the executable file required by the user can be obtained. , my father There is no specific limit on this.
  • webpack (a module packager) can be used under the Vue framework to package the source code of the list page, the source code of the detail page, the page jump function, the parameter parsing function, the option variable and other related source codes, and store them in the form of a folder
  • the user when using the local browser, the user can make a data request to the server to request such things as the page jump function, parameter parsing function, option variable defaultParams, parameters to, reg, from and next, and encodeURI involved in this disclosure. Function and decodeURI and other related source codes.
  • the pre-packaged executable files can be co-deployed to the local browser, which can avoid frequent data requests to the server.
  • the page display method provided by the exemplary embodiments of the present disclosure has clear logic, simple architecture, lightweight and easy implementation, and does not occupy too much memory. It is understandable that the page display method refers to data processing on the browser side.
  • parent-child pages in the exemplary embodiments of the present disclosure include but are not limited to list pages and details pages. That is to say, the parent-child pages can be any two pages in the page display scenario by storing and obtaining page jump parameters. This disclosure does not specifically limit this.
  • a first request is sent to the server to store the page jump parameters of the parent page, and the page jump parameters are retrieved from the parent page.
  • the parent page jumps to the sub-page corresponding to the target data; sends a second request to the server to obtain the page jump parameter of the parent page, and jumps from the sub-page according to the page jump parameter.
  • this disclosure allows the server to store page jump parameters when entering a subpage from a parent page. When returning from a subpage, the page jump parameters can be obtained from the server and the previous parent page can be restored based on the page jump parameters.
  • a page display device is also provided.
  • the device can be applied to a terminal device or a server.
  • the page display device 1000 may include a first page display module 1010 and a second page display module 1020, wherein:
  • the first page display module 1010 is configured to, when receiving a query operation for the target data in the parent page, send a first request to the server to store the page jump parameters of the parent page, and jump from the parent page to The subpage corresponding to the target data;
  • the second page display module 1020 is configured to send a second request to the server to obtain the page jump parameters of the parent page, and jump from the child page back to the parent page according to the page jump parameters. .
  • the page display device 1000 further includes:
  • the file configuration module is used to configure the target file.
  • the target file is used to store the relationship between the parent page and the child page. father-son relationship.
  • the page display device 1000 further includes:
  • the first variable definition module is used to define a first parameter memory variable, and the first parameter memory variable is used to mark whether to memorize the page jump parameter of the parent page;
  • the first guard definition module is used to define a first navigation guard.
  • the first navigation guard is used to assign values to the path attributes of the parent page and the path attributes of the child pages in the first object, and determine the path attributes by traversing the target file. When the first object exists in the target file, assign a value to the first parameter memory variable corresponding to the parent page in the first object.
  • the first page display module 1010 includes:
  • a parameter acquisition unit configured to acquire the page jump parameters of the parent page and the first parameter memory variable when receiving a query operation for the target data in the parent page;
  • a parameter conversion unit configured to convert the page jump parameter into a target parameter string when it is determined that the first parameter memory variable meets the preset condition using the page jump function
  • a parameter storage unit configured to send a first request carrying the target parameter string to the server to store the target parameter string on the server and jump to the target data from the parent page. the corresponding subpage.
  • the parameter conversion unit includes:
  • Parameter conversion subunit used to convert the page jump parameter into an initial parameter string when the page jump function is used to determine that the first parameter memory variable value is the target value
  • a string encoding subunit used to encode the initial parameter string to obtain the first parameter string
  • a string encryption subunit is used to encrypt the first parameter string to obtain the target parameter string.
  • the page display device 1000 further includes:
  • the second variable definition module is used to define a second parameter memory variable, and the second parameter memory variable is used to mark whether the page jump parameter of the parent page exists in the target file;
  • the second guard definition module is used to define a second navigation guard.
  • the second navigation guard is used to assign values to the path attributes of the parent page and the path attributes of the child pages in the second object, and determine the path attributes by traversing the target file. When the second object exists in the target file, assign a value to the second parameter memory variable corresponding to the parent page in the second object.
  • the second page display module 1020 includes:
  • a string acquisition unit configured to send a second request to the server to obtain the target parameter string from the server when the parameter parsing function is used to determine that the second parameter memory variable value is the target value;
  • a string decryption unit used to decrypt the target parameter string to obtain the first parameter string
  • a string decoding unit configured to decode the first parameter string to obtain the initial parameter string, and convert the initial parameter string into a page jump parameter of the parent page;
  • a page jump unit is used to jump from the sub-page back to the parent page according to the page jump parameter.
  • the page jump unit includes:
  • a parameter assignment subunit is used to assign the current value of the page jump parameter to an option variable, and the option variable is used to save the default value of the page jump parameter;
  • the page jump sub-unit is used to jump from the sub-page back to the parent page according to the assigned option variable.
  • Each module in the above device can be a general-purpose processor, including a central processing unit, a network processor, etc.; it can also be a digital signal processor, an application-specific integrated circuit, a field programmable gate array or other programmable logic devices, discrete gates or transistors Logic devices, discrete hardware components. Each module can also be implemented by software, firmware, etc. Each processor in the above device can be an independent processor or can be integrated together.
  • Exemplary embodiments of the present disclosure also provide a computer-readable storage medium on which a program product capable of implementing the method described above in this specification is stored.
  • various aspects of the present disclosure can also be implemented in the form of a program product, which includes program code.
  • the program product When the program product is run on an electronic device, the program code is used to cause the electronic device to execute the above-mentioned instructions in this specification.
  • the steps according to various exemplary embodiments of the present disclosure are described in the "Exemplary Methods" section.
  • the program product may take the form of a portable compact disk read-only memory (CD-ROM) and include the program code, and may be run on an electronic device, such as a personal computer.
  • CD-ROM portable compact disk read-only memory
  • the program product of the present disclosure is not limited thereto.
  • a readable storage medium may be any tangible medium containing or storing a program that may be used by or in conjunction with an instruction execution system, apparatus, or device.
  • the Program Product may take the form of one or more readable media in any combination.
  • the readable medium may be a readable signal medium or a readable storage medium.
  • the readable storage medium may be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, device or device, or any combination thereof. More specific examples (non-exhaustive list) of readable storage media include: electrical connection with one or more conductors, portable disk, hard disk, random access memory (RAM), read only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fiber, portable compact disk read-only memory (CD-ROM), optical storage device, magnetic storage device, or any suitable combination of the above.
  • a computer-readable signal medium may include a data signal propagated in baseband or as part of a carrier wave carrying readable program code therein. Such propagated data signals may take many forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination of the above.
  • a readable signal medium may also be any readable medium other than a readable storage medium that can send, propagate, or transport the program for use by or in connection with an instruction execution system, apparatus, or device.
  • Program code embodied on a readable medium may be transmitted using any suitable medium, including but not limited to wireless, wireline, optical cable, RF, etc., or any suitable combination of the foregoing.
  • Program code for performing the operations of the present disclosure may be written in any combination of one or more programming languages, including object-oriented programming languages such as Java, C++, etc., as well as conventional procedural programming. Language—such as "C” or a similar programming language.
  • the program code may execute entirely on the user's computing device, partly on the user's device, as a stand-alone software package, partly on the user's computing device and partly on a remote computing device, or entirely on the remote computing device or server execute on.
  • the remote computing device may be connected to the user computing device through any kind of network, including a local area network (LAN) or a wide area network (WAN), or may be connected to an external computing device (such as an Internet service provider through the Internet). connect).
  • LAN local area network
  • WAN wide area network
  • an external computing device such as an Internet service provider through the Internet. connect
  • Exemplary embodiments of the present disclosure also provide an electronic device capable of implementing the above method.
  • An electronic device 1100 according to such an exemplary embodiment of the present disclosure is described below with reference to FIG. 11 .
  • the electronic device 1100 shown in FIG. 11 is only an example and should not bring any limitations to the functions and scope of use of the embodiments of the present disclosure.
  • electronic device 1100 may take the form of a general computing device.
  • the components of the electronic device 1100 may include, but are not limited to: at least one processing unit 1110, at least one storage unit 1120, a bus 1130 connecting different system components (including the storage unit 1120 and the processing unit 1110), and a display unit 1140.
  • the storage unit 1120 stores program code, and the program code can be executed by the processing unit 1110, so that the processing unit 1110 performs the steps according to various exemplary embodiments of the present disclosure described in the above-mentioned "Example Method" section of this specification.
  • the processing unit 1110 may perform any one or more method steps in FIGS. 2 to 8 .
  • the storage unit 1120 may include a readable medium in the form of a volatile storage unit, such as a random access storage unit (RAM) 1121 and/or a cache storage unit 1122, and may further include a read-only storage unit (ROM) 1123.
  • RAM random access storage unit
  • ROM read-only storage unit
  • Storage unit 1120 may also include a program/utility 1124 having a set of (at least one) program modules 1125 including, but not limited to: an operating system, one or more application programs, other program modules, and program data, Each of these examples, or some combination, may include the implementation of a network environment.
  • program/utility 1124 having a set of (at least one) program modules 1125 including, but not limited to: an operating system, one or more application programs, other program modules, and program data, Each of these examples, or some combination, may include the implementation of a network environment.
  • Bus 1130 may be a local area representing one or more of several types of bus structures, including a memory unit bus or memory unit controller, a peripheral bus, a graphics acceleration port, a processing unit, or using any of a variety of bus structures. bus.
  • Electronic device 1100 may also communicate with one or more external devices 1200 (e.g., keyboard, pointing device, Bluetooth device, etc.), may also communicate with one or more devices that enable a user to interact with electronic device 1100, and/or with Any device (eg, router, modem, etc.) that enables the electronic device 1100 to communicate with one or more other computing devices. This communication may occur through an input/output (I/O) interface 1150.
  • the electronic device 1100 may also communicate with one or more networks (eg, a local area network (LAN), a wide area network (WAN), and/or a public network, such as the Internet) through the network adapter 1160. As shown, network adapter 1160 communicates with other modules of electronic device 1100 via bus 1130 .
  • network adapter 1160 communicates with other modules of electronic device 1100 via bus 1130 .
  • the example embodiments described here can be implemented by software, or can be implemented by software combined with necessary hardware. Therefore, the technical solution according to the embodiment of the present disclosure can be embodied in the form of a software product, which can be stored in a non-volatile storage medium (which can be a CD-ROM, U disk, mobile hard disk, etc.) or on the network , including several instructions to cause a computing device (which may be a personal computer, a server, a terminal device, a network device, etc.) to execute a method according to an exemplary embodiment of the present disclosure.
  • a computing device which may be a personal computer, a server, a terminal device, a network device, etc.

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • Computational Linguistics (AREA)
  • Data Mining & Analysis (AREA)
  • Databases & Information Systems (AREA)
  • Information Retrieval, Db Structures And Fs Structures Therefor (AREA)

Abstract

一种页面显示方法、装置、存储介质及电子设备；涉及计算机技术领域。方法包括：接收到对父页面中目标数据的查询操作时，向服务端发送第一请求以存储父页面的页面跳转参数，并从父页面跳转至目标数据对应的子页面；向服务端发送第二请求以获取父页面的页面跳转参数，并根据页面跳转参数从子页面跳转回父页面。从父页面进入子页面时可以由服务端存储页面跳转参数，再由子页面返回时，可以从服务端获取页面跳转参数，并根据页面跳转参数恢复之前的父页面，避免了由于页面跳转导致的页面刷新，进而提升了用户体验。

Description

页面显示方法、装置、存储介质及电子设备
相关申请的交叉引用
本公开要求于2022年03月10日提交的申请号为202210231183.2、名称为“页面显示方法、装置、存储介质及电子设备”的中国专利申请的优先权，该中国专利申请的全部内容通过引用全部并入本文。
技术领域
本公开涉及计算机技术领域，具体而言，涉及一种页面显示方法、页面显示装置、计算机可读存储介质以及电子设备。
背景技术
随着前端技术及框架的不断更新，页面功能及交互的复杂度也随着增加。在前端开发中，Vue是一套用于构建用户界面的渐进式框架，基于Vue框架可以快速开发前端页面，如可以实现单页面应用的开发。
使用Vue框架在开发单页面应用时，页面间跳转会导致页面刷新。以列表页面和详情页面之间的跳转为例，从筛选后的列表页面中选中某一数据并跳转至该数据的详情页面后，从详情页面返回列表页面时会返回到列表页面初始状态，而未保存上次筛选后的查询结果。若用户需要查看该查询结果，需要再次进行筛选操作，降低了用户体验。
需要说明的是，在上述背景技术部分公开的信息仅用于加强对本公开的背景的理解，因此可以包括不构成对本领域普通技术人员已知的现有技术的信息。
发明内容
本公开提供一种页面显示方法、页面显示装置、计算机可读存储介质以及电子设备。
本公开提供一种页面显示方法，包括：
接收到对父页面中目标数据的查询操作时，向服务端发送第一请求以存储所述父页面的页面跳转参数，并从所述父页面跳转至所述目标数据对应的子页面；
向所述服务端发送第二请求以获取所述父页面的页面跳转参数，并根据所述页面跳转参数从所述子页面跳转回所述父页面。
在本公开的一种示例性实施例中，从所述父页面跳转至所述目标数据对应的子页面前，所述方法还包括：
配置目标文件，所述目标文件用于存储所述父页面和子页面之间的父子关系。
在本公开的一种示例性实施例中，从所述父页面跳转至所述目标数据对应的子页面前，所述方法还包括：
定义第一参数记忆变量，所述第一参数记忆变量用于标记是否记忆所述父页面的页面跳转参数；
定义第一导航守卫，所述第一导航守卫用于对第一对象中父页面的路径属性和子页面的路径属性进行赋值，以及，通过遍历所述目标文件确定所述第一对象存在于所述目标文件中时，对所述第一对象中父页面对应的第一参数记忆变量进行赋值。
在本公开的一种示例性实施例中，所述接收到对父页面中目标数据的查询操作时，向服务端发送第一请求以存储所述父页面的页面跳转参数，并从所述父页面跳转至所述目标数据对应的子页面，包括：
接收到对所述父页面中目标数据的查询操作时，获取所述父页面的页面跳转参数和所述第一参数记忆变量；
当利用页面跳转函数确定所述第一参数记忆变量满足预设条件时，将所述页面跳转参数转换为目标参数字符串；
向所述服务端发送携带所述目标参数字符串的第一请求以在所述服务端存储所述目标参数字符串，并从所述父页面跳转至所述目标数据对应的子页面。
在本公开的一种示例性实施例中，所述当利用页面跳转函数确定所述第一参数记忆变量满足预设条件时，将所述页面跳转参数转换为目标参数字符串，包括：
当利用页面跳转函数确定所述第一参数记忆变量值为目标值时，将所述页面跳转参数转换为初始参数字符串；
对所述初始参数字符串进行编码，得到第一参数字符串；
对所述第一参数字符串进行加密，得到所述目标参数字符串。
在本公开的一种示例性实施例中，从所述子页面跳转回所述父页面前，所述方法还包括：
定义第二参数记忆变量，所述第二参数记忆变量用于标记所述目标文件中是否存在所述父页面的页面跳转参数；
定义第二导航守卫，所述第二导航守卫用于对第二对象中父页面的路径属性和子页面的路径属性进行赋值，以及，通过遍历所述目标文件确定所述第二对象存在于所述目标文件中时，对所述第二对象中父页面对应的第二参数记忆变量进行赋值。
在本公开的一种示例性实施例中，所述向所述服务端发送第二请求以获取所述父页面的页面跳转参数，并根据所述页面跳转参数从所述子页面跳转回所述父页面，包括：
当利用参数解析函数确定所述第二参数记忆变量值为目标值时，向所述服务端发送第二请求以从所述服务端获取所述目标参数字符串；
对所述目标参数字符串进行解密，得到所述第一参数字符串；
对所述第一参数字符串进行解码，得到所述初始参数字符串，并将所述初始参数字符串转化为所述父页面的页面跳转参数；
根据所述页面跳转参数从所述子页面跳转回所述父页面。
在本公开的一种示例性实施例中，所述根据所述页面跳转参数从所述子页面跳转回所述父页面，包括：
将所述页面跳转参数的当前值赋值给选项变量，所述选项变量用于保存所述页面跳转参数的默认值；
根据赋值后的选项变量从所述子页面跳转回所述父页面。
本公开提供一种页面显示装置，包括：
第一页面显示模块，用于接收到对父页面中目标数据的查询操作时，向服务端发送第一请求以存储所述父页面的页面跳转参数，并从所述父页面跳转至所述目标数据对应的子页面；
第二页面显示模块，用于向所述服务端发送第二请求以获取所述父页面的页面跳转参数，并根据所述页面跳转参数从所述子页面跳转回所述父页面。
本公开提供一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现上述任意一项所述的方法。
本公开提供一种电子设备，包括：处理器；以及存储器，用于存储所述处理器的可执行指令；其中，所述处理器配置为经由执行所述可执行指令来执行上述任意一项所述的方法。
应当理解的是，以上的一般描述和后文的细节描述仅是示例性和解释性的，并不能限制本公开。
附图说明
此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本公开的实施例，并与说明书一起用于解释本公开的原理。显而易见地，下面描述中的附图仅仅是本公开的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其它的附图。
图1示出了可以应用本公开实施例的一种页面显示方法及装置的示例性系统架构的示意图；
图2示意性示出了根据本公开的一个实施例的页面显示方法的流程图；
图3示意性示出了根据本公开的一个实施例的页面跳转时存储页面跳转参数的流程图；
图4示意性示出了根据本公开的一个实施例的页面跳转时对页面跳转参数进行处理的流程图；
图5示意性示出了根据本公开的另一个实施例的页面跳转时存储页面跳转参数的流程图；
图6示意性示出了根据本公开的一个实施例的页面返回时获取页面跳转参数的流程图；
图7示意性示出了根据本公开的另一个实施例的页面返回时获取页面跳转参数的流程图；
图8示意性示出了根据本公开的一个实施例的页面显示方法的完整流程图；
图9A示意性示出了根据本公开的一个实施例的原始列表页面的示意图；
图9B示意性示出了根据本公开的一个实施例的中间列表页面的示意图；
图9C示意性示出了根据本公开的一个实施例的工单详情页面的示意图；
图10示意性示出了根据本公开的一个实施例的页面显示装置的框图；
图11示意性示出了适于用来实现本公开实施例的电子设备的计算机系统的结构示意图。
具体实施方式
现在将参考附图更全面地描述示例实施方式。然而，示例实施方式能够以多种形式实施，且不应被理解为限于在此阐述的范例；相反，提供这些实施方式使得本公开将更加全面和完整，并将示例实施方式的构思全面地传达给本领域的技术人员。所描述的特征、结构或特性可以以任何合适的方式结合在一个或更多实施方式中。在下面的描述中，提供许多具体细节从而给出对本公开的实施方式的充分理解。然而，本领域技术人员将意识到，可以实践本公开的技术方案而省略所述特定细节中的一个或更多，或者可以采用其它的方法、组元、装置、步骤等。在其它情况下，不详细示出或描述公知技术方案以避免喧宾夺主而使得本公开的各方面变得模糊。
此外，附图仅为本公开的示意性图解，并非一定是按比例绘制。图中相同的附图标记表示相同或类似的部分，因而将省略对它们的重复描述。附图中所示的一些方框图是功能实体，不一定必须与物理或逻辑上独立的实体相对应。可以采用软件形式来实现这些功能实体，或在一个或多个硬件模块或集成电路中实现这些功能实体，或在不同网络和/或处理器装置和/或微控制器装置中实现这些功能实体。
图1示出了可以应用本公开实施例的一种页面显示方法及装置的示例性应用环境的系统架构的示意图。
如图1所示，系统架构100可以包括终端设备101、102、103中的一个或多个，网络104和服务器105。网络104用以在终端设备101、102、103和服务器105之间提供通信链路的介质。网络104可以包括各种连接类型，例如有线、无线通信链路或者光纤电缆等等。终端设备101、102、103可以是各种电子设备，包括但不限于台式计算机、便携式计算机、智能手机和平板电脑等，用于提供用户界面进行页面显示。例如，终端设备上安装有客户端(如浏览器)，通过浏览器客户端可以浏览页面。具体地，终端设备上的浏览器可以用于执行：接收到对父页面中目标数据的查询操作时，向服务端发送第一请求以存储所述父页面的页面跳转参数，并从所述父页面跳转至所述目标数据对应的子页面；向所述服务端发送第二请求以获取所述父页面的页面跳转参数，并根据所述页面跳转参数从所述子页面跳转回所述父页面。应该理解，图1中的终端设备、网络和服务器的数目仅仅是示意性的。根据实现需要，可以具有任意数目的终端设备、网络和服务器。例如，服务器105可以是一个服务器，也可以是多个服务器组成的服务器集群，还可以是云计算平台或者虚拟化中心。另外，服务器105可以用于为支持页面显示的视图组件等提供后台服务。
本公开实施例所提供的页面显示方法一般由终端设备101、102、103中的一个或多个 执行，相应的，页面显示装置一般设置于终端设备101、102、103中，例如，由终端设备执行后可以将上次的查询结果直接显示在终端设备的显示屏上，本示例性实施例中对此不做特殊限定。但本领域技术人员容易理解的是，本公开实施例所提供的页面显示方法也可以由服务器105执行，相应地，页面显示装置也可以设置于服务器105中，服务器可以存储用户选择的查询条件，以便于在进行页面跳转时可以根据该查询条件返回上次的查询结果，并由终端设备向用户进行展示。
以下对本公开实施例的技术方案进行详细阐述：
随着前端技术及框架的不断更新，页面功能及交互的复杂度也随着增加。在前端开发中，Vue是一套用于构建用户界面的渐进式框架，基于Vue框架可以快速开发前端页面，如可以实现单页面应用的开发。
使用Vue-Cli框架(Vue框架中的一种脚手架工具)在开发单页面应用时，页面间跳转会导致页面刷新。以列表页面和详情页面之间的跳转为例，从筛选后的列表页面中选中某一数据并跳转至该数据的详情页面后，从详情页面返回列表页面时会返回到列表页面初始状态，而未保存上次筛选后的查询结果。若用户需要查看该查询结果，需要再次进行筛选操作，降低了用户体验。
基于上述一个或多个问题，本示例实施方式提供了一种页面显示方法，该方法可以应用于上述终端设备101、102、103中的一个或多个，也可以应用于上述服务器105，本示例性实施例中对此不做特殊限定。参考图2所示，该页面显示方法可以包括步骤S210和步骤S220：
步骤S210.接收到对父页面中目标数据的查询操作时，向服务端发送第一请求以存储所述父页面的页面跳转参数，并从所述父页面跳转至所述目标数据对应的子页面；
步骤S220.向所述服务端发送第二请求以获取所述父页面的页面跳转参数，并根据所述页面跳转参数从所述子页面跳转回所述父页面。
在本公开示例实施方式所提供的页面显示方法中，通过接收到对父页面中目标数据的查询操作时，向服务端发送第一请求以存储所述父页面的页面跳转参数，并从所述父页面跳转至所述目标数据对应的子页面；向所述服务端发送第二请求以获取所述父页面的页面跳转参数，并根据所述页面跳转参数从所述子页面跳转回所述父页面。一方面，本公开从父页面进入子页面时可以由服务端存储页面跳转参数，再由子页面返回时，可以从服务端获取页面跳转参数，并根据页面跳转参数恢复之前的父页面，避免了由于页面跳转导致的页面刷新，用户无需再次操作即可获取上次的查询结果，进而提升了用户体验；另一方面，通过与服务端的交互即可实现页面跳转参数的存储和获取，无需使用内存存储数据，减少了内存消耗，从而提高了页面的显示性能。
下面，对于本示例实施方式的上述步骤进行更加详细的说明。
在步骤S210中，接收到对父页面中目标数据的查询操作时，向服务端发送第一请求以存储所述父页面的页面跳转参数，并从所述父页面跳转至所述目标数据对应的子页面。
本公开示例实施方式中，可以以单页面应用中的页面显示为例进行说明，对应的，父页面可以是列表页面，子页面可以是详情页面。其中，单页面应用是指只有一个主页面的应用程序，该应用程序在浏览器中运行时，系统只需加载一次资源，后续的操作交互和数据交互是通过Router(路由)、AJAX(Asynchronous Javascript And XML，一种创建交互式网页应用的网页开发技术)实现。列表页面和详情页面可以是由Vue-Cli框架开发的用户界面。具体地，列表页面可以是应用程序中用于显示重复性较高的界面元素的用户界面，且每个界面元素的次序、位置和数据源可以通过Vue-Cli框架控制。详情页面可以是应用程序中用于显示某一界面元素的详细内容的用户界面。
用户在查询列表页面中某一数据的详情时，需要在列表页面输入与该数据相关的查询条件。本公开示例实施方式中，查询条件可以包括筛选条件和分页条件。筛选条件可以是名称、类型等信息，分页条件可以是页码、每页的数据条数等信息。例如，若用户在列表页面中根据类型进行搜索，且列表页面带有的筛选条件为“alarmType:1”时，可以表示查找列表页面中报警类型为类型1的数据。若用户在列表页面中根据页码进行搜索，且列表页面带有的分页条件为“pageNum:2”时，可以表示在第二页中选择某一数据以查看该数据的详情。需要说明的是，列表页面可以包括原始列表页面和中间列表页面。其中，原始列表页面可以为列表页面的初始状态，中间列表页面可以为同时带有筛选条件和分页条件的列表页面。示例性的，在使用筛选条件(如alarmType:1)对原始列表页面进行筛选后，可以根据分页条件(如pageNum:2)将原始列表页面切换中间列表页面，即第二页，在第二页中选择某一数据后可以跳转至该数据的详情页面，此时对应的查询条件为：“alarmType:1,pageNum:2”。可以理解的是，原始列表页面可以默认为无筛选条件下的第一页数据，对应的查询条件为“alarmType:”,pageNum:1”。
一种示例实施方式中，父页面可以是原始列表页面，也可以是中间列表页面，即可以对原始列表页面中的数据进行详情查询，也可以对中间列表页面中的数据进行详情查询。以查询中间列表页面中数据的详情信息为例，接收到对中间列表页面中目标数据的查询操作时，可以向服务端发送请求以存储该中间列表页面的页面跳转参数，如可以将页面跳转参数存储于数据库中，并从该中间列表页面跳转至目标数据对应的详情页面。其中，页面跳转参数可以是中间列表页面携带的查询条件，目标数据可以为中间列表页面中的与详情页面关联的任一列表数据，详情页面可以是对目标数据进行查询详情操作时显示的第一个页面，向服务端发送的请求可以是http(hypertext transfer protocol，超文本传输协议)请求，如可以将中间列表页面的页面跳转参数通过第一请求如post请求发送至服务端，以使服务端将接收到的中间列表页面的页面跳转参数存储至数据库中。
需要说明的是，从父页面跳转至目标数据对应的子页面前，可以预先配置一个目标文件，该目标文件可以用于存储所有的父页面和子页面之间的父子关系。使用Vue-Cli框架开发应用程序时，对应的，目标文件可以是在Vue-store(存储文件夹)中配置的JS(Java Script，脚本语言)文件。例如，应用于应用程序中的页面跳转功能时，可以在Vue-store中配置一 个pageJumpMemory.js文件，该文件中用于描述应用程序中所有存在父子关系的页面，该文件中的数据可以形成一个配置项数组，以及该数组可以作为全局变量，只需在项目启动时加载一次，以拉取文件中的所有配置信息，并将所有的配置信息存储到store状态管理以便于后续进行全局调用。
示例性的，在web应用程序中，可以将pageJumpMemory.js文件中所有页面的父子关系以表格的形式进行配置和存储。当维护的原始表格中的父子关系发生变更时，可以相应地更新该表格。例如，若web应用程序在迭代过程中增加了新的父子关系页面，可以将新的父子页面添加至表格中，以实现web应用程序的及时更新。参考表1所示，示意性的给出了配置好的pageJumpMemory.js文件中用于存储页面父子关系的表格。其中，存在父子关系的页面有两组，分别为父页面1(path属性值：/fatherPage1/index)和子页面1(path属性值：/fatherPage1/son1)、父页面2(path属性值：/fatherPage2/index)和子页面2(path属性值：/fatherPage2/son1)，且从父页面1跳转至子页面1时，需要记忆父页面1携带的查询条件，从父页面2跳转至子页面2时，不需要记忆父页面2携带的查询条件。
表1
为了实现保留父页面携带的查询条件的功能，从父页面跳转至目标数据对应的子页面前，还可以定义第一参数记忆变量，即requireMemory，该第一参数记忆变量可以用于标记是否记忆父页面的页面跳转参数。例如，若requireMemory＝false，表示不需要记忆父页面的页面跳转参数；若requireMemory＝true，表示需要记忆父页面的页面跳转参数，也就是需要记忆父页面携带的查询条件。同时，还可以定义第一导航守卫，即beforeRouteLeave钩子函数，该守卫可以用于对第一对象中父页面的路径属性和子页面的路径属性进行赋值，以及通过遍历目标文件确定第一对象存在于目标文件中时，可以对第一对象中父页面对应的第一参数记忆变量进行赋值。具体地，在父页面注册beforeRouteLeave钩子函数时需要传入三个参数，分别为to、from和next。其中，参数to(Route，路由属性)表示即将要进入的目标路由对象，参数from(Route，路由属性)表示导航正要离开的路由对象，通过调用next函数执行路由跳转，执行效果依赖next函数的调用参数。
举例而言，可以定义一个临时对象temp＝{fatherPage：‘’，sonPage：‘’}作为第一对象。通过beforeRouteLeave钩子函数可以把参数to的path属性值赋值给temp.son，把参数from的path属性值赋值给temp.father，可以根据赋值后的path属性值从父页面跳转至子页面，也就是从当前页面跳转至目标页面。然后，可以遍历配置好的pageJumpMemory.js文件，以确定temp对象是否存在于该文件中。若该temp对象存在于pageJumpMemory.js文件中，则将把第一参数记忆变量requireMemory赋值为true；若该temp对象不存在于pageJumpMemory.js文件中，则将把第一参数记忆变量requireMemory赋值为false。
一种示例实施方式中，参考图3所示，可以根据步骤S310至步骤S330实现从父页面跳转至目标数据对应的子页面。
步骤S310.接收到对所述父页面中目标数据的查询操作时，获取所述父页面的页面跳转参数和所述第一参数记忆变量。
示例性的，仍以父页面为中间列表页面，子页面为详情页面为例进行说明。对于一个同时带有筛选条件和分页条件的中间列表页面，接收到对中间列表页面中目标数据的查询操作时，可以触发beforeRouteLeave钩子函数来调用页面跳转函数，并利用页面跳转函数从中间列表页面跳转至该目标数据对应的详情页面。其中，查询操作可以是用户对中间列表界面上“详情”控件的点击/短按操作，本公开对此不做具体限定。本公开示例实施方式中，页面跳转函数可以是toDetails函数，利用toDetails函数从中间列表页面跳转至详情页面时，可以通过服务端存储中间列表页面携带的页面跳转参数即查询条件，以便于从详情页面返回时可以从服务端获取该查询条件，并根据获取到的查询条件恢复上次的查询结果，无需用户再次对原始列表页面进行筛选操作，可以提高用户的使用体验。
具体地，调用toDetails函数时，需要传入第一参数记忆变量requireMemory和中间列表页面带有的页面跳转参数options。options为页面跳转时需要记忆的参数名和参数值，为对象数组类型。例如，查询条件为根据筛选条件“alarmType为1”对原始列表页面进行筛选后，再根据分页条件“第二页，每页包含10条数据”从原始列表页面切换为中间列表页面，以查询中间列表页面中的目标数据，对应于该查询条件传入的options可以为{pageNum:2,pageSize:10,alarmType:1}。
步骤S320.当利用页面跳转函数确定所述第一参数记忆变量满足预设条件时，将所述页面跳转参数转换为目标参数字符串。
传参完成后，参考图4所示，可以根据步骤S410至步骤S430对页面跳转参数进行处理，以将处理结果进行存储。
步骤S410.当利用页面跳转函数确定所述第一参数记忆变量值为目标值时，将所述页面跳转参数转换为初始参数字符串。
可以通过页面跳转函数判断第一参数记忆变量requireMemory是否满足预设条件，例如，预设条件可以是第一参数记忆变量值为目标值true，以根据requireMemory的值进行页面跳转。当确定requireMemory＝true时，可以将页面跳转参数转换为初始参数字符串。其中，页面跳转参数可以为中间列表页面带有的查询条件options，初始参数字符串可以是params字符串。需要说明的是，将页面跳转参数转换为参数字符串的目的在于可以将页面跳转参数转换为页面跳转函数可以统一识别的内容，方便统一集成化管理和操作。
示例性的，可以利用toDetails函数将options对象转换为params字符串，若options为{pageNum:2,pageSize:10,alarmType:1}，转换得到的params字符串可以为{”pageNum”:2,”pageSize”:10,”alarmType”:1}，如表2所示。
表2
步骤S420.对所述初始参数字符串进行编码，得到第一参数字符串。
为了增加页面跳转参数的安全性，将页面跳转参数转化为初始字符串后，可以对初始字符串进行编码，得到第一参数字符串。示例性的，可以利用toDetails函数将options对象转换为params字符串，该params字符串即为初始参数字符串。然后，可以使用encodeURI函数对该params字符串进行UTF-8(8-bit Unicode Transformation Format，可变长度字符编码)编码，编码后的params字符串即为第一参数字符串。其中，encodeURI函数可以将字符串作为URI组件进行编码。示例性的，编码后的params字符串可以为：“％7BpageNum％3Apagesize％22…”，如表3所示。
表3
可以看出，从编码后的params字符串中可以看到查询条件中的参数名称如pageNum、pagesize等，但无法获取各个参数的参数值，可以提高页面跳转参数的安全性。
步骤S430.对所述第一参数字符串进行加密，得到所述目标参数字符串。
在增加页面跳转参数安全性的基础上，进一步的，为了增加页面跳转参数的美观性，还可以对编码得到的第一参数字符串进行加密，得到目标参数字符串。
示例性地，首先，可以利用toDetails函数将options对象转换为params字符串，该params字符串即为初始参数字符串。然后，可以使用encodeURI函数编码params字符串，并对该params字符串的编码结果进行加密。其中，可以对params字符串的编码结果进行Base64编码，以加密params字符串的编码结果。可以理解的是，加密方法也可以是MD5(message-digest algorithm 5，信息-摘要算法)、SHA1(Secure Hash Algorithm 1，安全散列算法1)、Crypto-JS(一种JavaScript加密算法)等，本公开对此不做具体限定。编码后的params字符串即为第一参数字符串，加密得到的params字符串即为目标参数字符串。示例性的，加密后的params字符串可以为“cGFnZU51bTo1LCBw…”，如表4所示。
表4
可以看出，已经无法从加密后的params字符串中读取与查询条件相关的参数信息，进一步提高了页面跳转参数的安全性，同时还可以增加页面跳转参数的美观性。
其他示例中，也可以在利用toDetails函数将options对象转换为params字符串后，将 得到的params字符串作为目标参数字符串。还可以对转换得到的params字符串直接进行加密，将加密结果作为目标参数字符串。在加密过程中，还可以对params字符串进行多层加密，如可以对params字符串的编码结果依次进行Base64编码、MD5加密和SHA1加密等，以进一步提高页面跳转参数的安全性。或者还可以对转换得到的params字符串进行编码，直接将编码结果作为目标参数字符串，本公开对此不做具体限定。
步骤S330.向所述服务端发送携带所述目标参数字符串的第一请求以在所述服务端存储所述目标参数字符串，并从所述父页面跳转至所述目标数据对应的子页面。
得到目标参数字符串后，可以向服务端发送第一请求如post请求，post请求中可以携带该目标参数字符串，以将该目标参数字符串发送至服务端，并通过服务端将该目标参数字符串进行存储，实现了中间列表页面的查询条件的存储功能。然后，可以通过beforeRouteLeave钩子函数调用next函数以根据中间列表页面的path属性值和详情页面的path属性值进行页面跳转，从而从中间列表页面跳转至目标数据对应的详情页面。
一种示例实施方式中，参考图5所示，也可以根据步骤S501至步骤S506实现页面跳转。
步骤S501.判断requireMemory是否为true。通过页面跳转函数toDetails判断requireMemory的值，若requireMemory＝＝＝true，则执行步骤S502，否则直接执行步骤S506；
步骤S502.将options转换为params字符串；
步骤S503.对params字符串进行加密；
步骤S504.对加密得到的params字符串进行编码；
步骤S505.将编码后的params字符串通过post请求发送给服务端进行存储；
步骤S506.跳转至目标页面。
本公开示例实施方式中，使用vue-cli框架开发单页面应用时，只需要在父页面源码中添加页面跳转函数，即可实现从父页面跳转至子页面。利用页面跳转参数可以在页面跳转时存储父页面的查询条件，以从子页面返回时可以获取该查询条件，并根据获取到的查询条件恢复上次的查询结果，无需修改子页面源码，减少了用户的工作量，提高了用户的页面操作效率。而且，通过向服务端发送请求可以将父页面的查询条件存储至数据库中，无需使用内存存储数据，减少了内存消耗，从而提高了页面的显示性能。
在步骤S220中，向所述服务端发送第二请求以获取所述父页面的页面跳转参数，并根据所述页面跳转参数从所述子页面跳转回所述父页面。
本公开示例实施方式中，可以定义一个选项变量defaultParams，该选项变量可以用于保存页面跳转参数的默认值。例如，可以用于保存列表页面的初始查询条件，若初始查询条件为{pageNum:1,pageSize:10}，表示默认每页包含十条数据，并取第一页的数据进行展示。进入列表页面时默认会使用defaultParams作为查询条件并获取对应的列表数据。可以理解的是，列表页面的查询条件为初始查询条件时，展示的是列表页面的初始状态，即原始列表页面。当用户查询第一页中某一数据的详情时，可以从原始列表页面跳转至该数据 的详情页面，从该详情页面返回时，会使用defaultParams作为查询条件，此时的defaultParams为初始查询条件，根据初始查询条件获取的是第一页的列表数据，也就是可以从该详情页面直接跳转回原始列表页面。
本公开示例实施方式中是使用Vue框架实现单页面应用的页面显示，因此，从子页面跳转回父页面前，也就是从详情页面返回中间列表页面前，还可以定义第二参数记忆变量，即hasMemory，该第二参数记忆变量可以用于标记目标文件中是否存在父页面的页面跳转参数。例如，若hasMemory＝false，表示目标文件中不存在父页面的页面跳转参数；若hasMemory＝true，表示目标文件中存在父页面的页面跳转参数，也就是pageJumpMemory.js文件中存在父页面携带的查询条件。同时，还可以定义第二导航守卫，即beforeRouteEnter钩子函数，该守卫可以用于对第二对象中父页面的路径属性和子页面的路径属性进行赋值，以及通过遍历目标文件确定第二对象存在于目标文件中时，对第二对象中父页面对应的第二参数记忆变量进行赋值。具体地，在父页面定义beforeRouteEnter钩子函数时也需要传入to、from和next三个参数。其中，参数to表示当前页面，参数from表示上一个页面，通过调用next函数执行页面跳转，执行效果依赖next函数的调用参数。
举例而言，可以定义一个临时对象temp2＝{fatherPage：‘’，sonPage：‘’}作为第二对象。通过beforeRouteEnter钩子函数可以把参数to的path属性值赋值给temp2.son，把参数from的path属性值赋值给temp2.father，可以根据赋值后的path属性值从子页面跳转回父页面，也就是从当前页面跳转至上一个页面。然后，可以遍历配置好的pageJumpMemory.js文件，以确定temp2对象是否存在于该文件中。若该temp2对象存在于pageJumpMemory.js文件中，则将把第二参数记忆变量hasMemory赋值为true；若该temp2对象不存在于pageJumpMemory.js文件中，则将把第二参数记忆变量hasMemory赋值为false。
当用户查询中间列表页面中某一数据的详情时，可以从中间列表页面跳转至该数据的详情页面，从该详情页面返回时，会使用defaultParams作为查询条件，根据初始查询条件获取的是原始列表页面的列表数据，也就是可以从该详情页面跳转回原始列表页面。用户在详情页面查看目标数据的详细内容并从详情页面返回时，为了避免由于页面刷新导致从详情页面返回至原始列表页面而丢失了上次的查询结果，可以调用参数解析函数，并利用参数解析函数从详情页面返回保留上次查询结果的列表页面，即返回至中间列表页面。本公开示例实施方式中，参数解析函数可以是getMemoryParams函数。示例性的，接收到用户对浏览器界面中页面回退控件的触发操作时，可以触发beforeRouteEnter钩子函数来调用getMemoryParams函数，并利用getMemoryParams函数在进入列表页面前完成上次查询条件的获取和解析，从而便于根据解析结果修改defaultParams的值，进而恢复上次的查询结果，无需用户再次对列表页面进行筛选等操作，提高了用户的使用体验。
示例性的，从详情页面返回中间列表页面时，可以利用beforeRouteEnter钩子函数在进入中间列表页面前调用getMemoryParams函数，通过getMemoryParams函数向服务端发送请求以获取中间列表页面的页面跳转参数，并根据页面跳转参数从详情页面返回中间列表 页面。其中，向服务端发送的请求可以是http请求，如可以向服务端发送第二请求如get请求，以使服务端返回中间列表页面的页面跳转参数。
一种示例实施方式中，参考图6所示，可以根据步骤S610至步骤S630实现从子页面跳转回保留上次查询结果的父页面，例如，可以从详情页面跳转回中间列表页面。
步骤S610.当利用参数解析函数确定所述第二参数记忆变量值为目标值时，向所述服务端发送第二请求以从所述服务端获取所述目标参数字符串。
具体地，调用getMemoryParams函数时，可以传入用于提取上次查询条件的参数，包括参数reg、to、from和next。其中，reg为正则表达式，利用reg可以匹配与当前列表页面对应的详情页面URL。to、from和next可以从beforeRouteEnter钩子函数中得到，to和from均为对象类型数据，通过to可以获取列表页面的信息，通过from可以获取进入列表页面前所在页面的信息，next是一个跳转函数，beforeRouteEnter钩子函数要求业务代码执行完毕后必须调用next函数，用于标志该函数的完成并进入页面加载流程。
传参完成后，可以利用getMemoryParams函数获取目标参数字符串。示例性的，从详情页面返回时，可以先利用getMemoryParams函数检验数据库中是否存储了中间列表页面的查询条件。示例性的，当第二参数记忆变量值hasMemory为目标值true时，表明数据库中存在中间列表页面的页面跳转参数，则可以向服务端发送第二请求如get请求以从服务端获取目标参数字符串。可以理解的是，若中间列表页面和详情页面不存在于pageJumpMemory.js文件中，即hasMemory＝false时，可以表明此次页面跳转不是从指定详情页面跳转回中间列表页面，或者数据库中不存在中间列表页面的页面跳转参数，此时可以直接执行next()进入列表页面，也就是返回到列表页面的初始状态。
步骤S620.对所述目标参数字符串进行解密，得到所述第一参数字符串。
从服务端获取目标参数字符串后，可以对目标参数字符串进行解析，以得到页面跳转参数。示例性的，若从中间列表页面跳转至详情页面时，是先将options对象转换为params字符串，再使用encodeURI函数编码params字符串，并对params字符串的编码结果进行Base64编码，通过加密params字符串的编码结果得到params字符串“cGFnZU51bTo1LCBw…”。对应的，解析params字符串“cGFnZU51bTo1LCBw…”时，可以先对params字符串“cGFnZU51bTo1LCBw…”进行Base64解密，得到解密后的params字符串“％7BpageNum％3Apagesize％22…”，该字符串即为第一参数字符串，以便于后续对第一参数字符串进行解码，得到初始参数字符串，并将初始参数字符串转化为页面跳转参数。
步骤S630.对所述第一参数字符串进行解码，得到所述初始参数字符串，并将所述初始参数字符串转化为所述父页面的页面跳转参数。
得到第一参数字符串后，可以对第一参数字符串进行解码，得到初始参数字符串，并将初始参数字符串转化为中间列表页面的页面跳转参数。示例性的，可以使用decodeURI函数对解密后的params字符串“％7BpageNum％3Apagesize％22…”进行解码，解码后的 params字符串{”pageNum”:2,”pageSize”:10,”alarmType”:1}即为初始参数字符串。然后，可以把该params字符串恢复成对象类型的数据options{pageNum:2,pageSize:10,alarmType:1}。
其他示例中，若目标参数字符串为params字符串“％7BpageNum％3Apagesize％22…”，可以先使用decodeURI函数对该params字符串“％7BpageNum％3Apagesize％22…”进行解码，得到解码后的params字符串{”pageNum”:2,”pageSize”:10,”alarmType”:1}。然后，可以把解码后的params字符串恢复成对象类型的数据options{pageNum:2,pageSize:10,alarmType:1}。若目标参数字符串为params字符串{”pageNum”:2,”pageSize”:10,”name”:”name1”,”type”:”type1”}时，可以直接将该params字符串恢复成对象类型的数据options{pageNum:2,pageSize:10,name:'name1',type:'type1'}，本公开对此做限定。
步骤S640.根据所述页面跳转参数从所述子页面跳转回所述父页面。
提取到页面跳转参数后，可以将页面跳转参数的当前值赋值给选项变量defaultParams，以根据赋值后的选项变量从详情页面跳转回中间列表页面。示例性的，赋值完成后，选项变量defaultParams由初始查询条件{pageNum:1,pageSize:10}变为options{pageNum:2,pageSize:10,alarmType:1}，通过调用执行next()进入中间列表页面，也即实现了从详情页面跳转回保留上次查询结果的列表页面。
需要说明的是，根据页面跳转参数从详情页面跳转回保留上次查询结果的列表页面后，可以将数据库中存储的页面跳转参数进行删除，实现数据库表中仅有0或1条记录，极大减轻了数据库的存储压力。例如，可以通过delete请求实现页面跳转参数的删除，删除页面跳转参数的具体实现方式可以根据具体实现场景进行更改，本公开对此不做具体限定。
该示例中，使用Vue-cli框架开发单页面应用时，只需要在父页面源码中添加参数解析函数，即可实现从子页面跳转回保留上次查询结果的父页面。从子页面返回时通过读取之前记录的查询条件恢复父页面查询结果，无需修改子页面源码，减少了用户的工作量，提高了用户的页面操作效率。
一种示例实施方式中，参考图7所示，可以根据步骤S701至步骤S708实现从详情页面跳转回列表页面。
步骤S701.检验列表页面和详情页面是否存在于pageJumpMemory.js文件中。若是，则执行步骤S702，若否，此次页面跳转不是从指定详情页面跳转回中间列表页面，或者数据库中不存在中间列表页面的页面跳转参数，则执行步骤S707；
步骤S702.向服务端发送get请求获取params字符串；
步骤S703.对params字符串进行解码；
步骤S704.对解码后的params字符串进行解密；
步骤S705.将解密得到的params字符串转换为options对象；
步骤S706.将options赋值给defaultParams；
步骤S707.进入列表页面，如可以执行next()进入列表页面；
步骤S708.使用defaultParams请求列表数据，渲染列表数据并通过终端设备向用户进 行显示。
本公开示例实施方式中，实现从详情页面返回列表页面时还可以保留上次查询结果需要两步：第一，在离开列表页面前，在列表页面beforeRouterLeave钩子函数中调用页面跳转函数(如toDetails函数)判断当前页面的查询条件是否需要记忆，如果需要记忆则向服务端发送post请求以存储查询条件。其中，向服务端发送post请求前已对查询条件进行了base64编码，可以保证请求的安全性；第二，在进入列表页面之前，在列表页面的beforeRouteEnter钩子函数中调用参数解析函数(如getMemoryParams函数)判断是否存在列表页面的查询条件，如果存在则向服务端发送get请求以获取查询条件，对获取到的查询条件进行读取和解析，得到上次的查询条件options，并将页面默认查询条件即选项变量defaultParams修改为上次的查询条件options，即可完成列表页面上次查询结果的恢复。该方法只需要在列表页面源码中添加页面跳转函数和参数解析函数，无需修改详情页面源码，减少了用户完成该功能所需的工作量，提高了用户的操作效率。另外，基于http请求实现页面跳转参数的存储和获取，进而实现了保留和获取上次查询条件的功能，无需使用内存存储数据，减少了内存消耗，从而提高了页面的显示性能。
一种示例实施方式中，参考图8所示，可以根据步骤S801至步骤S807进行页面显示。
步骤S801.配置父子页面关系。在浏览器的Vue-store中配置pageJumpMemory.js文件，用于存储并维护父子关系页面，以及是否需要记忆父页面的页面跳转参数；
步骤S802.页面跳转前，给第一参数记忆变量赋值。判断当前页面和目标页面是否存在于pageJumpMemory.js文件中，若存在，则给第一参数记忆变量赋值为true，否则，给第一参数记忆变量赋值为false；
步骤S803.页面跳转时，根据第一参数记忆变量向服务端发送post请求存储页面跳转参数。当第一参数记忆变量值为true时，可以将经过编码处理的页面跳转参数通过post请求发送至服务端，以使服务端将该页面跳转参数存储至数据库中；
步骤S804.服务端接收到浏览器发送的post请求，存储页面跳转参数至数据库；
步骤S805.页面返回时，向服务端发送get请求获取页面跳转参数；
步骤S806.服务端接收浏览器发送的get请求，从数据库中获取页面跳转参数，将页面跳转参数返回至浏览器，并及时清除数据库中存储的页面跳转参数；
步骤S807.对获取的页面跳转参数进行解码，根据解码结果请求对应的数据，以重新渲染浏览器页面。
该示例中，一方面，从父页面进入子页面时可以由服务端存储页面跳转参数，再由子页面返回时，可以从服务端获取页面跳转参数，并根据页面跳转参数恢复之前的父页面，避免了由于页面跳转导致的页面刷新，用户无需再次操作即可获取上次的查询结果，进而提升了用户体验；另一方面，通过与服务端的交互即可实现页面跳转参数的存储和获取，无需使用内存存储数据，减少了内存消耗，从而提高了页面的显示性能。
参考图9A所示，示意性给出了一种用于运维服务的应用程序在运行时显示的列表页 面。可以看出，图9A显示的是列表页面的初始状态，即原始列表页面，对应的查询条件为“name:”,pageNum:1”，也就是无筛选条件下的第一页数据。该列表页面中包括6条列表数据，每条列表数据包括工单编号、工单名称和工单状态，如第一条列表数据为工单编号为202101的测试工单，该工单的当前状态为已解决。可以理解的是，列表页面中的每条列表数据均可以作为目标数据，用户选中某条列表数据时，也就是选中某个工单时，可以执行该工单对应的“查看详情”操作以从当前列表页面进入该工单的详情页面。例如，点击“查看详情”时，可以触发beforeRouteLeave钩子函数，并通过beforeRouteLeave钩子函数调用toDetails函数，以利用toDetails函数从当前列表页面跳转至该工单的详情页面时通过服务端存储当前列表页面的查询条件。其中，“工单编号”、“工单名称”和“工单状态”均可以作为筛选条件，页码和每页6条数据可以作为分页条件。另外，用户也可以直接选取目标页码前往对应的中间列表页面。
示例性的，当用户输入工单名称“禁止入侵”后，可以点击搜索按钮对100条列表数据进行筛选，筛选完成后可以向用户展示“禁止入侵”工单所在的列表页面。参考图9B所示，示意性给出了带有筛选条件和分页条件的列表页面，即中间列表页面。可以看出，该列表页面对应的查询条件为“name:禁止入侵,pageNum:6”，图9B中的6条列表数据均为禁止入侵工单，每条列表数据均可以作为目标数据。当用户执行某一条列表数据的查看详情操作时，可以从图9B所示的列表页面跳转至该列表数据对应的详情页面。例如，当用户选择工单编号为202131的禁止入侵工单并执行查看详请操作时，可以从当前列表页面进入该工单的详情页面，如可以进入如图9C所示的详情页面。该详情页面中包括6项详情数据，分别是工单名称、工单编号、工单状态、创建人、创建人联系方式、创建时间和相关图片。
从图9C所示的详情页面返回时，可以返回至图9B所示的列表页面，直接向用户展示筛选条件为“禁止入侵”的第6页列表数据，而不会返回至图9A所示的列表页面。例如，点击“回退”操作时，可以触发beforeRouteEnter钩子函数，并通过beforeRouteEnter钩子函数调用getMemoryParams函数，以利用getMemoryParams函数从服务端获取9B所示列表页面的页面跳转参数，并根据页面跳转参数重新请求列表数据和渲染页面。从详情页面返回列表页面时可以保留上次查询结果，便于用户进行查看，提高了用户体验。
可以理解的是，当用户执行图9A中某一条列表数据的查看详情操作时，可以从图9A所示的列表页面跳转至该列表数据对应的详情页面。从该详情页面返回时，可以跳转回图9A所示的列表页面，即返回至列表页面的初始状态，同样也实现了从详情页面返回列表页面时可以保留上次查询结果的功能。
还需说明的是，本公开示例实施方式中可以预先将beforeRouteLeave钩子函数、beforeRouteEnter钩子函数、页面跳转函数、参数解析函数和选项变量封装为可执行文件并存储至浏览器中，以在接收到对列表页面中目标数据的查询操作时执行该可执行文件。该可执行文件中还可以包括参数to、reg、from和next等源码，以及用于编码和加密的算法源码等，也即可以根据用户的实际需求进行源码封装并得到用户所需的可执行文件，本公 开对此不做具体限定。示例性的，可以在Vue框架下使用webpack(一种模块打包器)将列表页面源码、详情页面源码、页面跳转函数、参数解析函数和选项变量等相关源码进行打包，并以文件夹形式存储于服务器中，用户在本地浏览器进行使用时可以向服务器进行数据请求，以请求诸如本公开涉及到的页面跳转函数、参数解析函数、选项变量defaultParams、参数to、reg、from和next、encodeURI函数和decodeURI等相关源码。优选的，在用户首次进行列表页面访问时，即可将预先打包好的可执行文件共同部署至本地浏览器，可以避免频繁的向服务器进行数据请求。本公开所示例实施方式所提供的页面显示方法逻辑清晰、架构简单、轻量化、易实现，且不会占用过多内存。可以理解的是，该页面显示方法指在浏览器端进行数据处理。
需要说明的是，本公开示例实施方式中的父子页面包括但不限于列表页面和详情页面，也就是说父子页面可以是通过存储、获取页面跳转参数进行页面显示场景中的任意两个页面，本公开对此不做具体限定。
在本公开示例实施方式所提供的页面显示方法中，通过接收到对父页面中目标数据的查询操作时，向服务端发送第一请求以存储所述父页面的页面跳转参数，并从所述父页面跳转至所述目标数据对应的子页面；向所述服务端发送第二请求以获取所述父页面的页面跳转参数，并根据所述页面跳转参数从所述子页面跳转回所述父页面。一方面，本公开从父页面进入子页面时可以由服务端存储页面跳转参数，再由子页面返回时，可以从服务端获取页面跳转参数，并根据页面跳转参数恢复之前的父页面，避免了由于页面跳转导致的页面刷新，用户无需再次操作即可获取上次的查询结果，进而提升了用户体验；另一方面，通过与服务端的交互即可实现页面跳转参数的存储和获取，无需使用内存存储数据，减少了内存消耗，从而提高了页面的显示性能。
应当注意，尽管在附图中以特定顺序描述了本公开中方法的各个步骤，但是，这并非要求或者暗示必须按照该特定顺序来执行这些步骤，或是必须执行全部所示的步骤才能实现期望的结果。附加的或备选的，可以省略某些步骤，将多个步骤合并为一个步骤执行，以及/或者将一个步骤分解为多个步骤执行等。
进一步的，本示例实施方式中，还提供了一种页面显示装置。该装置可以应用于一终端设备或服务器。参考图10所示，该页面显示装置1000可以包括第一页面显示模块1010和第二页面显示模块1020，其中：
第一页面显示模块1010，用于接收到对父页面中目标数据的查询操作时，向服务端发送第一请求以存储所述父页面的页面跳转参数，并从所述父页面跳转至所述目标数据对应的子页面；
第二页面显示模块1020，用于向所述服务端发送第二请求以获取所述父页面的页面跳转参数，并根据所述页面跳转参数从所述子页面跳转回所述父页面。
在一种可选的实施方式中，该页面显示装置1000还包括：
文件配置模块，用于配置目标文件，所述目标文件用于存储所述父页面和子页面之间 的父子关系。
在一种可选的实施方式中，该页面显示装置1000还包括：
第一变量定义模块，用于定义第一参数记忆变量，所述第一参数记忆变量用于标记是否记忆所述父页面的页面跳转参数；
第一守卫定义模块，用于定义第一导航守卫，所述第一导航守卫用于对第一对象中父页面的路径属性和子页面的路径属性进行赋值，以及，通过遍历所述目标文件确定所述第一对象存在于所述目标文件中时，对所述第一对象中父页面对应的第一参数记忆变量进行赋值。
在一种可选的实施方式中，第一页面显示模块1010包括：
参数获取单元，用于接收到对所述父页面中目标数据的查询操作时，获取所述父页面的页面跳转参数和所述第一参数记忆变量；
参数转换单元，用于当利用页面跳转函数确定所述第一参数记忆变量满足预设条件时，将所述页面跳转参数转换为目标参数字符串；
参数存储单元，用于向所述服务端发送携带所述目标参数字符串的第一请求以在所述服务端存储所述目标参数字符串，并从所述父页面跳转至所述目标数据对应的子页面。
在一种可选的实施方式中，参数转换单元包括：
参数转换子单元，用于当利用页面跳转函数确定所述第一参数记忆变量值为目标值时，将所述页面跳转参数转换为初始参数字符串；
字符串编码子单元，用于对所述初始参数字符串进行编码，得到第一参数字符串；
字符串加密子单元，用于对所述第一参数字符串进行加密，得到所述目标参数字符串。
在一种可选的实施方式中，该页面显示装置1000还包括：
第二变量定义模块，用于定义第二参数记忆变量，所述第二参数记忆变量用于标记所述目标文件中是否存在所述父页面的页面跳转参数；
第二守卫定义模块，用于定义第二导航守卫，所述第二导航守卫用于对第二对象中父页面的路径属性和子页面的路径属性进行赋值，以及，通过遍历所述目标文件确定所述第二对象存在于所述目标文件中时，对所述第二对象中父页面对应的第二参数记忆变量进行赋值。
在一种可选的实施方式中，第二页面显示模块1020包括：
字符串获取单元，用于当利用参数解析函数确定所述第二参数记忆变量值为目标值时，向所述服务端发送第二请求以从所述服务端获取所述目标参数字符串；
字符串解密单元，用于对所述目标参数字符串进行解密，得到所述第一参数字符串；
字符串解码单元，用于对所述第一参数字符串进行解码，得到所述初始参数字符串，并将所述初始参数字符串转化为所述父页面的页面跳转参数；
页面跳转单元，用于根据所述页面跳转参数从所述子页面跳转回所述父页面。
在一种可选的实施方式中，页面跳转单元包括：
参数赋值子单元，用于将所述页面跳转参数的当前值赋值给选项变量，所述选项变量用于保存所述页面跳转参数的默认值；
页面跳转子单元，用于根据赋值后的选项变量从所述子页面跳转回所述父页面。
上述页面显示装置中各模块的具体细节已经在对应的页面显示方法中进行了详细的描述，因此此处不再赘述。
上述装置中各模块可以是通用处理器，包括：中央处理器、网络处理器等；还可以是数字信号处理器、专用集成电路、现场可编程门阵列或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件。各模块也可以由软件、固件等形式来实现。上述装置中的各处理器可以是独立的处理器，也可以集成在一起。
本公开的示例性实施方式还提供了一种计算机可读存储介质，其上存储有能够实现本说明书上述方法的程序产品。在一些可能的实施方式中，本公开的各个方面还可以实现为一种程序产品的形式，其包括程序代码，当程序产品在电子设备上运行时，程序代码用于使电子设备执行本说明书上述“示例性方法”部分中描述的根据本公开各种示例性实施方式的步骤。该程序产品可以采用便携式紧凑盘只读存储器(CD-ROM)并包括程序代码，并可以在电子设备，例如个人电脑上运行。然而，本公开的程序产品不限于此，在本文件中，可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。
程序产品可以采用一个或多个可读介质的任意组合。可读介质可以是可读信号介质或者可读存储介质。可读存储介质例如可以为但不限于电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。可读存储介质的更具体的例子(非穷举的列表)包括：具有一个或多个导线的电连接、便携式盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。
计算机可读信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了可读程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。可读信号介质还可以是可读存储介质以外的任何可读介质，该可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。
可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于无线、有线、光缆、RF等等，或者上述的任意合适的组合。
可以以一种或多种程序设计语言的任意组合来编写用于执行本公开操作的程序代码，程序设计语言包括面向对象的程序设计语言—诸如Java、C++等，还包括常规的过程式程序设计语言—诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算设备上执行、部分地在用户设备上执行、作为一个独立的软件包执行、部分在用户计算设备上部分在远程计算设备上执行、或者完全在远程计算设备或服务器上执行。在涉及远程计算 设备的情形中，远程计算设备可以通过任意种类的网络，包括局域网(LAN)或广域网(WAN)，连接到用户计算设备，或者，可以连接到外部计算设备(例如利用因特网服务提供商来通过因特网连接)。
本公开的示例性实施方式还提供了一种能够实现上述方法的电子设备。下面参照图11来描述根据本公开的这种示例性实施方式的电子设备1100。图11显示的电子设备1100仅仅是一个示例，不应对本公开实施方式的功能和使用范围带来任何限制。
如图11所示，电子设备1100可以以通用计算设备的形式表现。电子设备1100的组件可以包括但不限于：至少一个处理单元1110、至少一个存储单元1120、连接不同系统组件(包括存储单元1120和处理单元1110)的总线1130和显示单元1140。
存储单元1120存储有程序代码，程序代码可以被处理单元1110执行，使得处理单元1110执行本说明书上述“示例性方法”部分中描述的根据本公开各种示例性实施方式的步骤。例如，处理单元1110可以执行图2至图8中任意一个或多个方法步骤。
存储单元1120可以包括易失性存储单元形式的可读介质，例如随机存取存储单元(RAM)1121和/或高速缓存存储单元1122，还可以进一步包括只读存储单元(ROM)1123。
存储单元1120还可以包括具有一组(至少一个)程序模块1125的程序/实用工具1124，这样的程序模块1125包括但不限于：操作系统、一个或者多个应用程序、其它程序模块以及程序数据，这些示例中的每一个或某种组合中可能包括网络环境的实现。
总线1130可以为表示几类总线结构中的一种或多种，包括存储单元总线或者存储单元控制器、外围总线、图形加速端口、处理单元或者使用多种总线结构中的任意总线结构的局域总线。
电子设备1100也可以与一个或多个外部设备1200(例如键盘、指向设备、蓝牙设备等)通信，还可与一个或者多个使得用户能与该电子设备1100交互的设备通信，和/或与使得该电子设备1100能与一个或多个其它计算设备进行通信的任何设备(例如路由器、调制解调器等等)通信。这种通信可以通过输入/输出(I/O)接口1150进行。并且，电子设备1100还可以通过网络适配器1160与一个或者多个网络(例如局域网(LAN)，广域网(WAN)和/或公共网络，例如因特网)通信。如图所示，网络适配器1160通过总线1130与电子设备1100的其它模块通信。应当明白，尽管图中未示出，可以结合电子设备1100使用其它硬件和/或软件模块，包括但不限于：微代码、设备驱动器、冗余处理单元、外部磁盘驱动阵列、RAID系统、磁带驱动器以及数据备份存储系统等。
通过以上的实施方式的描述，本领域的技术人员易于理解，这里描述的示例实施方式可以通过软件实现，也可以通过软件结合必要的硬件的方式来实现。因此，根据本公开实施方式的技术方案可以以软件产品的形式体现出来，该软件产品可以存储在一个非易失性存储介质(可以是CD-ROM，U盘，移动硬盘等)中或网络上，包括若干指令以使得一台计算设备(可以是个人计算机、服务器、终端装置、或者网络设备等)执行根据本公开示例性实施方式的方法。
此外，上述附图仅是根据本公开示例性实施方式的方法所包括的处理的示意性说明，而不是限制目的。易于理解，上述附图所示的处理并不表明或限制这些处理的时间顺序。另外，也易于理解，这些处理可以是例如在多个模块中同步或异步执行的。
应当注意，尽管在上文详细描述中提及了用于动作执行的设备的若干模块或者单元，但是这种划分并非强制性的。实际上，根据本公开的实施方式，上文描述的两个或更多模块或者单元的特征和功能可以在一个模块或者单元中具体化。反之，上文描述的一个模块或者单元的特征和功能可以进一步划分为由多个模块或者单元来具体化。
应当理解的是，本公开并不局限于上面已经描述并在附图中示出的精确结构，并且可以在不脱离其范围进行各种修改和改变。本公开的范围仅由所附的权利要求来限制。

Claims (11)

  1. 一种页面显示方法，其特征在于，包括：
    接收到对父页面中目标数据的查询操作时，向服务端发送第一请求以存储所述父页面的页面跳转参数，并从所述父页面跳转至所述目标数据对应的子页面；
    向所述服务端发送第二请求以获取所述父页面的页面跳转参数，并根据所述页面跳转参数从所述子页面跳转回所述父页面。
  2. 根据权利要求1所述的页面显示方法，其特征在于，从所述父页面跳转至所述目标数据对应的子页面前，所述方法还包括：
    配置目标文件，所述目标文件用于存储所述父页面和子页面之间的父子关系。
  3. 根据权利要求2所述的页面显示方法，其特征在于，从所述父页面跳转至所述目标数据对应的子页面前，所述方法还包括：
    定义第一参数记忆变量，所述第一参数记忆变量用于标记是否记忆所述父页面的页面跳转参数；
    定义第一导航守卫，所述第一导航守卫用于对第一对象中父页面的路径属性和子页面的路径属性进行赋值，以及，通过遍历所述目标文件确定所述第一对象存在于所述目标文件中时，对所述第一对象中父页面对应的第一参数记忆变量进行赋值。
  4. 根据权利要求3所述的页面显示方法，其特征在于，所述接收到对父页面中目标数据的查询操作时，向服务端发送第一请求以存储所述父页面的页面跳转参数，并从所述父页面跳转至所述目标数据对应的子页面，包括：
    接收到对所述父页面中目标数据的查询操作时，获取所述父页面的页面跳转参数和所述第一参数记忆变量；
    当利用页面跳转函数确定所述第一参数记忆变量满足预设条件时，将所述页面跳转参数转换为目标参数字符串；
    向所述服务端发送携带所述目标参数字符串的第一请求以在所述服务端存储所述目标参数字符串，并从所述父页面跳转至所述目标数据对应的子页面。
  5. 根据权利要求4所述的页面显示方法，其特征在于，所述当利用页面跳转函数确定所述第一参数记忆变量满足预设条件时，将所述页面跳转参数转换为目标参数字符串，包括：
    当利用页面跳转函数确定所述第一参数记忆变量值为目标值时，将所述页面跳转参数转换为初始参数字符串；
    对所述初始参数字符串进行编码，得到第一参数字符串；
    对所述第一参数字符串进行加密，得到所述目标参数字符串。
  6. 根据权利要求2所述的页面显示方法，其特征在于，从所述子页面跳转回所述父页面前，所述方法还包括：
    定义第二参数记忆变量，所述第二参数记忆变量用于标记所述目标文件中是否存在所述父页面的页面跳转参数；
    定义第二导航守卫，所述第二导航守卫用于对第二对象中父页面的路径属性和子页面的路径属性进行赋值，以及，通过遍历所述目标文件确定所述第二对象存在于所述目标文件中时，对所述第二对象中父页面对应的第二参数记忆变量进行赋值。
  7. 根据权利要求6所述的页面显示方法，其特征在于，所述向所述服务端发送第二请求以获取所述父页面的页面跳转参数，并根据所述页面跳转参数从所述子页面跳转回所述父页面，包括：
    当利用参数解析函数确定所述第二参数记忆变量值为目标值时，向所述服务端发送第二请求以从所述服务端获取所述目标参数字符串；
    对所述目标参数字符串进行解密，得到所述第一参数字符串；
    对所述第一参数字符串进行解码，得到所述初始参数字符串，并将所述初始参数字符串转化为所述父页面的页面跳转参数；
    根据所述页面跳转参数从所述子页面跳转回所述父页面。
  8. 根据权利要求7所述的页面显示方法，其特征在于，所述根据所述页面跳转参数从所述子页面跳转回所述父页面，包括：
    将所述页面跳转参数的当前值赋值给选项变量，所述选项变量用于保存所述页面跳转参数的默认值；
    根据赋值后的选项变量从所述子页面跳转回所述父页面。
  9. 一种页面显示装置，其特征在于，包括：
    第一页面显示模块，用于接收到对父页面中目标数据的查询操作时，向服务端发送第一请求以存储所述父页面的页面跳转参数，并从所述父页面跳转至所述目标数据对应的子页面；
    第二页面显示模块，用于向所述服务端发送第二请求以获取所述父页面的页面跳转参数，并根据所述页面跳转参数从所述子页面跳转回所述父页面。
  10. 一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现权利要求1-8任一项所述方法。
  11. 一种电子设备，其特征在于，包括：
    处理器；以及
    存储器，用于存储所述处理器的可执行指令；
    其中，所述处理器配置为经由执行所述可执行指令来执行权利要求1-8任一项所述的方法。
PCT/CN2023/077733 2022-03-10 2023-02-22 页面显示方法、装置、存储介质及电子设备 WO2023169215A1 (zh)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN202210231183.2A CN115080154A (zh) 2022-03-10 2022-03-10 页面显示方法、装置、存储介质及电子设备
CN202210231183.2 2022-03-10

Publications (1)

Publication Number Publication Date
WO2023169215A1 true WO2023169215A1 (zh) 2023-09-14

Family

ID=83247970

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2023/077733 WO2023169215A1 (zh) 2022-03-10 2023-02-22 页面显示方法、装置、存储介质及电子设备

Country Status (2)

Country Link
CN (1) CN115080154A (zh)
WO (1) WO2023169215A1 (zh)

Families Citing this family (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN115080154A (zh) * 2022-03-10 2022-09-20 京东方科技集团股份有限公司 页面显示方法、装置、存储介质及电子设备

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107704499A (zh) * 2017-08-28 2018-02-16 深圳市华傲数据技术有限公司 一种应用程序的页面跳转控制方法及装置
CN107818101A (zh) * 2016-09-12 2018-03-20 北京新唐思创教育科技有限公司 页面跳转的方法及其装置
CN109871209A (zh) * 2018-12-30 2019-06-11 贝壳技术有限公司 列表页面状态恢复方法及装置
CN111428164A (zh) * 2020-03-27 2020-07-17 五八有限公司 页面显示方法、装置、移动终端、电子设备及存储介质
CN115080154A (zh) * 2022-03-10 2022-09-20 京东方科技集团股份有限公司 页面显示方法、装置、存储介质及电子设备

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107818101A (zh) * 2016-09-12 2018-03-20 北京新唐思创教育科技有限公司 页面跳转的方法及其装置
CN107704499A (zh) * 2017-08-28 2018-02-16 深圳市华傲数据技术有限公司 一种应用程序的页面跳转控制方法及装置
CN109871209A (zh) * 2018-12-30 2019-06-11 贝壳技术有限公司 列表页面状态恢复方法及装置
CN111428164A (zh) * 2020-03-27 2020-07-17 五八有限公司 页面显示方法、装置、移动终端、电子设备及存储介质
CN115080154A (zh) * 2022-03-10 2022-09-20 京东方科技集团股份有限公司 页面显示方法、装置、存储介质及电子设备

Also Published As

Publication number Publication date
CN115080154A (zh) 2022-09-20

Similar Documents

Publication Publication Date Title
US11146286B2 (en) Compression of JavaScript object notation data using structure information
US10942708B2 (en) Generating web API specification from online documentation
US20210248143A1 (en) Automatically executing graphql queries on databases
CN108984714B (zh) 页面渲染方法、装置、电子设备及计算机可读介质
US10073899B2 (en) Efficient storage using automatic data translation
US9619449B2 (en) Compact encoding of node locations
US11256773B2 (en) Document online preview method and device
WO2023092580A1 (zh) 页面显示方法、装置、存储介质及电子设备
WO2018177032A1 (zh) 处理响应数据的方法、设备、客户端设备和电子设备
CN110858202A (zh) 数据库查询语句中where子句的生成方法和生成装置
WO2023169215A1 (zh) 页面显示方法、装置、存储介质及电子设备
CN110795649A (zh) 目标页面展示方法、装置、系统及电子设备
CN110109983B (zh) 一种操作Redis数据库的方法和装置
CN113268955A (zh) 报文转换的方法和装置
CN108959294B (zh) 一种访问搜索引擎的方法和装置
US8875094B2 (en) System and method for implementing intelligent java server faces (JSF) composite component generation
CN112182603B (zh) 反爬虫方法和装置
US20180046656A1 (en) Constructing filterable hierarchy based on multidimensional key
CN113722007A (zh) Vpn分支设备的配置方法、装置及系统
CN110647331A (zh) 开发工具的获取方法及装置、存储介质、电子设备
WO2020026016A1 (zh) 一种新闻分享的方法、装置和设备/终端/服务器
US20220253467A1 (en) Method, device and program product for generating configuration information of storage system
WO2023066063A1 (en) Replaying a webpage based on virtual document object model
CN113420037B (zh) 资产数据实时变更方法及装置
CN112925573B (zh) 网页加载的方法、装置、设备和计算机可读介质

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 23765793

Country of ref document: EP

Kind code of ref document: A1