dynamic-vue-layout-components icon indicating copy to clipboard operation
dynamic-vue-layout-components copied to clipboard

Double creation fix

Open namero999 opened this issue 5 years ago • 5 comments
trafficstars

This is a proposed solution to the double creation problem. I think it might have something to do with the synchronization of the layout property. The approach is based on the routes' meta property, where we can declaratively define the layout that we want for each view (I think it's semantically equivalent to wrapping the view in the layout component).

The PR has 2 commits. The first one simply adds logging to the created hooks (via mixins) and to the "data fetching" method, so that we can see the problem.

The second one implements the proposed solution, and the logging demonstrates that we do not have anymore the double component creation, as well as guaranteeing that the "data fetching" is not performed twice (this proves that the layout is effectively recycled).

namero999 avatar Jan 03 '20 13:01 namero999

A few things that worry me:

  1. Nested routes are not supported
  2. Nesting layouts are also not supported
  3. Passing entire vue components in meta feels a bit wrong.
  4. Would it work with async components.

I am far from thinking Markus did not think of this, it just moves away the login from the nice template system and to a allot less prominent place.

dobromir-hristov avatar Jan 03 '20 13:01 dobromir-hristov

A few things that worry me:

  1. Nested routes are not supported
  2. Nesting layouts are also not supported

These are valid concerns, but they apply to the original project as well. It's functionally equivalent, I didn't try to add any feature here, only fix a bug.

  1. Passing entire vue components in meta feels a bit wrong.

Depends on whether you are on the eager-load or lazy-load team :)

  1. Would it work with async components.

If you mean lazy-loaded component, it does. If you mean something else, let me know!

namero999 avatar Jan 03 '20 14:01 namero999

  1. Nested routes are not supported
  2. Nesting layouts are also not supported

These are valid concerns, but they apply to the original project as well. It's functionally equivalent, I didn't try to add any feature here, only fix a bug.

Moreover, I think there's space to make it work. I'll try later.

namero999 avatar Jan 03 '20 14:01 namero999

Traversing matched routes and looking for a layout is how I have made it in the past. But if you want to nest them, you need to know which level to loop.

dobromir-hristov avatar Jan 03 '20 14:01 dobromir-hristov

I've tried same approach with dynamically loaded components, but problem still remains. On every layout component change slot content is re-rendered. Maybe someone wants to try portals. With dynamically loaded layouts there is a switch from default (for example div) layout to newly loaded so this problem goes out as soon as possible. I've tried all route hooks to change layout before route starts render, but unsuccessful. @namero999 @dobromir-hristov have you invented something better for this time?

ulcuber avatar Dec 24 '21 13:12 ulcuber