Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Unexpected recursion when component's filename matches subcomponent's alias #3472

Closed
thexeos opened this issue Mar 24, 2021 · 3 comments
Closed

Comments

@thexeos
Copy link

thexeos commented Mar 24, 2021

Version

3.0.7

Reproduction link

https://codesandbox.io/s/bold-violet-1t891

Steps to reproduce

(quasar not required to reproduce the issue, but it was the fastest way to get all the right dependencies in one place)

  • Open /privacy route (/#/privacy), blank page shows
  • Open /fixed route (/#/fixed), Privacy Policy is displayed

What is expected?

Privacy Policy displayed in both cases

What is actually happening?

For /privacy route, console will show "Unhandled error during execution of scheduler flush."

[... more of the same]
  at <PrivacyPolicy> 
  at <PrivacyPolicy> 
  at <PrivacyPolicy> 
  at <PrivacyPolicy onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > 
  at <RouterView> 
  at <QPageContainer> 
  at <QLayout view="hHh lpR fFf" > 
  at <MainLayout onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > 
  at <RouterView> 
  at <App>

image

Basically, there is a conflict between multiple components having the same alias. This happens in dev mode and in production mode. There is no actual conflict, but it seems that somehow the names are being globally registered without "scoping" them to the component that creates the alias.


This issue was also reported to Quasar at quasarframework/quasar#8672

After trying Quasar@v2 beta, which uses Vue 3, privacy policy page stopped opening.

The use case here is that there is a shared component that contains privacy policy text, which can be displayed in a popup dialog and also as a standalone page.

@thexeos
Copy link
Author

thexeos commented Mar 24, 2021

This has a simple workaround: changing the alias of the subcomponent that is causing the problem.

For example, instead of having:

pages/PrivacyPolicy.vue

<template>
  <PrivacyPolicy />
</template>

You can have:

pages/PrivacyPolicy.vue

<template>
  <PrivacyPolicyContents />
</template>

Where PrivacyPolicyContents is just an alternative name for PrivacyPolicy defined in components of pages/PrivacyPolicy.

@edison1105
Copy link
Member

edison1105 commented Mar 24, 2021

Duplicate of #2821 see #2827

@HcySunYang
Copy link
Member

Closed because of duplication

@github-actions github-actions bot locked and limited conversation to collaborators Oct 24, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants