Vue JS和表中的模型绑定

Vue JS and model binding in tables

本文关键字：模型 绑定 JS Vue      更新时间：2023-09-26

为什么不能通过v-model在这样的表中绑定模型：

<table class="table">
    <thead>
    <th>Select</th>
    <th>Responder ID</th>
    <th>Heading 2</th>
    </thead>
    <tbody>
        <tr v-for="responder in responders">
            <td v-model="selected" @click="selectResponder(responder)"><span class="glyphicon glyphicon-bullhorn"></span></td>
            <td>@{{ responder.userReference }}</td>
        </tr>
    </tbody>
</table>

我想实现的是，当用户单击表行中的字形图标时，所选元素将绑定到我的javascript中的变量。

v-model用于将变量绑定到任何类型的表单输入，不适用于<td>元素。你的@click方法可以做你所描述的：

//in your Vue instance
...
methods:{
    selectResponder(responder){
        //either...
        responder.selected = true;
        //or maybe...
        this.selected = responder;
    }
}
...
相关文章：