Vue--How can page initialization data be updated to subcomponents in time

Scenario: Click the "Process" button in Figure 1--the query result of the query page to reach Figure 2--Basic Information,

The green box is the "policy number", "report number" and "file number" brought over from the data clicked in Figure 1--the query result,

In addition to the data in the green box, the corresponding parameters are passed to the backend during initialization, and the data returned by the backend is displayed on the page.

Then, the module like basic information in the project must be multiplexed and most of it is a public component, so how can we pass it to the subcomponents and display it in time when the page is initialized and the backend returns data?

one. Click the "Proceed to Process" button in a piece of data in the query page-query result to jump to the details page and pass the "policy number", "report number" and "report number" to the details page

     1. Inquiry page - the same method for viewing and going to processing  

      2. Query page----state is the state I judged, and the key parameters are in the red box

        3. Details page----Receive the data passed from the query page, organize the initialization interface to input parameters, and call this method in created.

 

Because only strings can be passed in the address bar, and what we want to pass is an object, so we need to use JSON package.

        4. Details page----interface anti-parameter binding variable

         5. Details page - call the basic information of the subcomponent - pass the data just received from the interface to the subcomponent

         6. Basic information of subcomponents ---- connect data with props attribute

 Because it is a passed object, it belongs to a complex data structure, so use deep monitoring deep 

        7. Basic information of subcomponents ---- Be sure to write each value, otherwise there will be problems in the two-way binding

 The details page uses an empty object to receive the data and just pass it to the subcomponent

Guess you like

Origin blog.csdn.net/weixin_62355341/article/details/123771532