Skip to content

Commit

Permalink
docs: include the change of forcemount for certain component in migra…
Browse files Browse the repository at this point in the history
…tion step
  • Loading branch information
zernonia committed Feb 24, 2025
1 parent c8d12d7 commit 5bdfeae
Showing 1 changed file with 35 additions and 0 deletions.
35 changes: 35 additions & 0 deletions docs/content/docs/guides/migration.md
Original file line number Diff line number Diff line change
Expand Up @@ -138,3 +138,38 @@ CSS variable and data attributes names have been updated to use the `reka` prefi
</SelectValue>
</template>
```

### Presence

To have better supports for SSR content, we also modify the logic around the usage of `forceMount` for component that utilize Presence:

- `Accordion`
- `Collapsible`
- `Tabs`
- `NavigationMenu`

[`forceMount` will now render the component](https://github.com/unovue/reka-ui/commit/6f7f29abe79ac6c3ace117a398b6f7613ab6d2bc) eventhough the state is inactive. You are now required to handle the visibility logic of the component manually.

```vue
<template>
<TabsRoot
v-slot="{ modelValue }"
default-value="tab1"
>
<TabsContent
value="tab1"
force-mount
:hidden="modelValue !== 'tab1'"
>
</TabsContent>
<TabsContent
value="tab2"
force-mount
:hidden="modelValue !== 'tab2'"
>
</TabsContent>
</TabsRoot>
</template>
```

0 comments on commit 5bdfeae

Please sign in to comment.