我有一个自定义数字键盘，他输入的值会绑定在num上，现在我想在循环遍历的多个input上使用这个键盘，vue3代码实现

在Vue3中，你可以创建一个自定义的`NumberKeyboard`组件，并利用Vue的响应式特性以及数组操作来实现在多个`<input>`元素上共享同一个键盘。这里是一个简单的例子：

首先，定义你的`NumberKeyboard`组件，假设它接收一个`value` prop，并处理按键事件：

<template>
  <div class="number-keyboard">
    <!-- 数字键盘布局... -->
    <button @click="onKeyPress(num)">{{ num }}</button> <!-- 绑定当前值到按钮上 -->
  </div>
</template>

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

// 初始化默认值
const num = ref(0);

// 自定义键盘事件处理函数
function onKeyPress(newNum) {
  num.value = newNum; // 更新 num 的值
}
</script>

然后，在父组件中，你可以这样使用它：

<template>
  <div>
    <NumberKeyboard v-for="(item, index) in items" :key="index" :value="item.num" @update="handleUpdate(index)" />
  </div>
</template>

<script setup>
import NumberKeyboard from './components/NumberKeyboard.vue';
let items = ref([{ num: 0 }, { num: 0 }]); // 假设items是个包含两个对象的数组

// 更新特定输入框的值
function handleUpdate(index) {
  items[index].num = num.value;
}
</script>

在这个例子中，每个`NumberKeyboard`组件都有自己的`num`属性，但是在`handleUpdate`函数中，我们更新的是数组对应位置的`num`值，实现了多个输入框共享键盘的效果。