---
url: "https://vueda.dev/v3/reference/api/js/use/useSlotNameResolver/functions/useSlotNameResolver.md"
title: "useSlotNameResolver"
---

# useSlotNameResolver

## Overview

Helper to resolve the most specific slot name from a list of candidates in order of precedence.

## Signature

`useSlotNameResolver(slotNamesInOrderOfPrecedence, slots)`

### Parameters

| Name | Type | Required | Description |
| --- | --- | --- | --- |
| <span id="param-slotNamesInOrderOfPrecedence">slotNamesInOrderOfPrecedence</span> | [SlotNamesInOrderOfPrecedence](/v3/reference/api/js/use/useSlotNameResolver/types/SlotNamesInOrderOfPrecedence.md) | yes | The slot names to check for, in order of  precedence. |
| <span id="param-slots">slots</span> | `object` | no | The slots object to check against. If not provided, the current  instance's slots will be used. |

### Returns

`- The resolved slot name.`

## Examples

```vue
<script setup>
import { useSlotNameResolver } from '@vueda/use/useSlotNameResolver.js';

// some reactive/dynamic logic
const myFieldName = computed(() => 'myField');
const mySlotsNames = computed(() => ([
  `field(${unref(myFieldName)})mySlot`, `field-mySlot`, 'mySlot'
]));
const mySlot = useSlotNameResolver(mySlotsNames);
</script>
<template>
    ...
    <!-- translate outside slot names to mySlot -->
    <some-sub-component>
      <template name="mySlot">
        <slot v-if="mySlot.exists" :name="mySlot.name" />
      </template>
    </some-sub-component>
    ...
</template>
```

## Source

`client/lib/use/useSlotNameResolver.js:58`