如何在Vue.js中添加一组文本输入

Question

我有一个数组，用于显示与模型绑定的复选框列表。

检查项目时，模型会填充数组。我在另一个 v-for 中使用此数组，我会显示已检查的项目。到现在为止还挺好。现在我想在每个选中的项旁边显示一个文本输入。

现在问题是我不确定如何将这些新文本输入绑定到模型。

我尝试过类似下面的内容。但它不起作用。有什么想法吗？

<ul v-for="player in players">
    <li>
        <label :for="player.id">
            <input type="checkbox" :id="player.id" :value="player" v-model="checkedNames"> {{player.name}}
        </label>
    </li>
</ul>

<ul v-for="checked in checkedNames">
    <li>{{checked.name}} <input type="number" v-model="scores[checked.id]"></li>
</ul>