dantodev
dantodev

Reputation: 66

Add vue.js Component from Child to Parent

Is there any way to render a vue.js component from a child component to on of its parents (maybe not the direct parent) like with slots but in the opposite direction?

My use case: In my root component I do have a <router-view> and a container for modals. from any child component of the router-view I would like to be able to add a child component to the modal wrapper.

Did I miss a feature of vue.js here or is there a even better practice to solve this problem?

Upvotes: 1

Views: 1778

Answers (2)

dantodev
dantodev

Reputation: 66

Roy J answered a solution in the comments:

The solution is to use Dynamic Components to create a "placeholder" component in the root component and switch its content by emiting Custom Events in the child components.

Upvotes: 0

Piotr Bączkowski
Piotr Bączkowski

Reputation: 11

I guess I am late to the party, but here is my solution for coming generations (valid only if you use vue-router):

routes: [  
  path: '/dashboard',
  name: 'dashboard',
  component: DashboardIndex,
  children: [{
      path: 'popup',
      component: PopupPlaceholder,
      children: [{
          path: 'a',
          name: 'a',
          component: A,
      }, {
          path: 'b',
          name: 'b',
          component: B,
      }],
  }],
]

Upvotes: 1

Related Questions