Vue3 Dynamic Refs

Vue3:Dynamic-Refs.vue

<script setup>
import { ref } from 'vue';

const inputs = {
    f1: ref(),
    f2: ref(),
    f3: ref(),
}

function clickMe(refId) {
    var input = inputs[refId]?.value
    input?.focus()
}
</script>

<template>
    <div @click="clickMe('f1')">
        <input :ref="inputs.f1" />
        <Icon />
    </div>
    <div @click="clickMe('f2')">
        <input :ref="inputs.f2" />
        <Icon />
    </div>
    <div @click="clickMe('f3')">
        <input :ref="inputs.f3" />
        <Icon />
    </div>
</template>