Skip to content

TextMorph does not render initial text prop in Nuxt #42

@greglalle

Description

@greglalle

When using the Vue package of Torph inside a Nuxt project, the initial value passed to the text prop is not rendered.
Instead, the generated .torph-root span remains empty on first render.

The text only appears after the prop value changes, with a reactive ref for example.

Here's the code:

<template>
  <div>
    <!-- Does NOT render -->
    <TextMorph :text="'Lorem ipsum'" />

    <!-- Only renders after update -->
    <TextMorph :text="text" />
  </div>
</template>

<script setup>
import { TextMorph } from 'torph/vue'
import { ref, onMounted } from 'vue'

const text = ref('Lorem ipsum')

onMounted(() => {
  text.value = 'Test'
})
</script>

Nuxt: 4.2.2
Vue: 3.5.26

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions