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

Named Slot doesn't work correctly on Vue3 #526

Open
fumiama opened this issue Apr 28, 2024 · 1 comment
Open

Named Slot doesn't work correctly on Vue3 #526

fumiama opened this issue Apr 28, 2024 · 1 comment
Labels
bug Something isn't working

Comments

@fumiama
Copy link

fumiama commented Apr 28, 2024

Describe the bug

I'm using Vue3 but the Named Slot didn't work properly.

Steps to reproduce

Just use the code in README,

<vue-advanced-chat>
  <div slot="room-header">
    This is a new room header
  </div>
</vue-advanced-chat>

Result I got

The web is running normally but nothing changed. The room header is not replaced.

If I replace the <div slot="room-header"> to <template #room-header>, it will throw an error

[plugin:vite:vue] Codegen node is missing for element/if/for node. Apply appropriate transforms first.

Expected behavior

The room header is replaced.

Device

  • OS: MacOS Ventura 13.6.5
  • Browser: Edge 124.0.2478.51
  • Package version: 2.1.0
@fumiama fumiama added the bug Something isn't working label Apr 28, 2024
@fumiama
Copy link
Author

fumiama commented Apr 28, 2024

I just noticed that the code could take effect sometimes by adjusting the window width or hiding rooms list. But after a refresh, the replacement disappeared. Here is the demo video.

demo.mp4

@fumiama fumiama changed the title Named Slot not work on Vue3 Named Slot doesn't work correctly on Vue3 Apr 28, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant