ui-group-option.vue 953 B

12345678910111213141516171819202122232425262728293031323334353637
  1. <template>
  2. <div class="group-option">
  3. <span v-if="props.label" class="group-option-label">
  4. {{ props.label }}
  5. </span>
  6. <slot />
  7. </div>
  8. </template>
  9. <script lang="ts" setup>
  10. import { getCurrentInstance, inject, onBeforeMount, onUnmounted } from 'vue'
  11. import { Relation } from './constant'
  12. const props = defineProps({
  13. label: String,
  14. })
  15. defineOptions({
  16. name: 'UIGroupOption',
  17. })
  18. const brotherInstances = inject(Relation)
  19. const instance = getCurrentInstance()
  20. if (brotherInstances.value) {
  21. onBeforeMount(() => (brotherInstances.value = [...brotherInstances.value, instance]))
  22. onUnmounted(() => {
  23. const index = brotherInstances.value.indexOf(instance)
  24. if (~index) {
  25. brotherInstances.value.splice(index, 1)
  26. brotherInstances.value = [...brotherInstances.value]
  27. }
  28. })
  29. }
  30. </script>
  31. <!-- <script>
  32. export default { name: 'UiGroupOption' }
  33. </script> -->