NuxtN
Nuxt9mo ago
16 replies
Rohjans

Nuxt UI 3 Dynamic Icons

I am in the process of migrating my project to Nuxt 3 and an issue I am having is with a dynamic icon feature I had in a form.

Previsouly I had it setup the following way:
    const displayIcon = computed(() => {
        if (!state.icon) return ''

        return `i-heroicons-${state.icon}`
    })

<UIcon
                            class="h-full"
                            :name="displayIcon"
                            dynamic />


What do I have to change to make it work now? Yes I have the HeroIcons collection installed and I can use icons just fine if I hard code them in the prop.
Was this page helpful?