Open
Description
In my nuxt app when I have a case that I want to change the icon according to a ref, but, even if the prop of CIcon (icon) is changing it doesn't update the content and re-render CIcon with the new value.
<template>
<span class="tw-ml-2 tw-self-center">
<CIcon
:icon="currentIcon"
size="xl"
class="tw-cursor-pointer !tw-text-gray-500 tw-select-none"
@click="togglePasswordVisibility"
/>
</span>
</template>
<script lang="ts" setup>
const emit = defineEmits(['toggleInputType'])
const isHidden = ref(true)
const currentIcon = computed(() => {
return isHidden.value ? cilLockLocked : cilLockUnlocked
})
const togglePasswordVisibility = () => {
isHidden.value = !isHidden.value
emit('toggleInputType')
}
</script>
Metadata
Metadata
Assignees
Labels
No labels