fix: spoiler state

This commit is contained in:
Anthony Fu 2022-11-27 15:20:33 +08:00
parent 342783eecc
commit 6fee5026bf

View file

@ -1,7 +1,12 @@
<script setup lang="ts"> <script setup lang="ts">
const props = defineProps<{ enabled: boolean }>() const props = defineProps<{ enabled: boolean }>()
const [showContent, toggleContent] = $(useToggle(!props.enabled)) const showContent = ref(!props.enabled)
const toggleContent = useToggle(showContent)
watchEffect(() => {
showContent.value = !props.enabled
})
</script> </script>
<template> <template>
@ -11,5 +16,5 @@ const [showContent, toggleContent] = $(useToggle(!props.enabled))
{{ showContent ? 'Show less' : 'Show more' }} {{ showContent ? 'Show less' : 'Show more' }}
</button> </button>
</div> </div>
<slot v-if="showContent" /> <slot v-if="!enabled || showContent" />
</template> </template>