VUE 简单的单选全选框联动，以及获取选中数据

最新推荐文章于 2024-07-30 13:18:38 发布

棋盘之上

最新推荐文章于 2024-07-30 13:18:38 发布

阅读量2.5k

点赞数 1

文章标签： VUE 单选框/全选框联动获取选中的对象

本文链接：https://blog.csdn.net/qq_42425578/article/details/87862702

版权

本文介绍了如何在Vue项目中实现单选全选框的联动效果，并详细说明了所需的参数设置，包括dataList、allchange和selectList。同时，讲解了关键的JS方法，包括获取后台数据、单选与全选框的绑定方法，以及点击确定按钮时如何储存和获取选中的对象。

摘要由CSDN通过智能技术生成

一、首先附上页面效果图+代码。

<div style="padding-right:7px;padding-left:10px ;padding-top:5px;>
    <table class="table-bordered"  style="font-size: 12px ;width:95%;">
        <thead style="text-align:center;font-size:13px">
           <tr>
              <th>名称</th>
              <th>编号</th>
              <th>型号</th>
              <th style="width: 10%">
                 <input type="checkbox" v-model="allchange"  @change="changeAll()" />
               </th>
           </tr>
        </thead>
        <tbody style="text-align:center;font-size:12px;word-break:break-all;">
           <tr v-f