[vue] Handling the problem of calling each other between vue components

background

When using the drawer component recently, I encountered a thorny problem, that is, the drawer is used by the seat details function, which will bring about a problem. It may be necessary to call the "order details drawer" in the "user details drawer", and the " "Order Details Drawer" may also call "User Details Drawer". Simply put, component A calls component B, and component B calls component A.

Problem Description

现象一:
Failed to reload /src/views/wireless/resource/components/xxxx/xxxx.vue. This could be due to syntax errors or importing non-existent modules. (see errors above)

现象二:
[Vue warn]: Unknown custom element:XXXX - did you register the component correctly? For recursive components, make sure to provide the “name” option

The above two cases belong to this type of problem, you can try this method

solution

Just set one of the components to be imported dynamically. For example: A component introduces B component through "import"

  • Introduce:
  components: {
    
    
    CompUserDetailDrawer: () => import('@/components/ViewUserManager/CompUserDetailDrawer.vue'),
  },
  • use
 <comp-user-detail-drawer ref="CompUserDetailDrawer" :baseInfo="baseInfo"/>

Guess you like

Origin blog.csdn.net/m0_37572422/article/details/130933889
Recommended