el-checkbox如何获取所在行的ID

el-checkbox： 静态页面，现实功能为：选中删除职数，则将将条记录删除

 

      <div class="left">
              <span>执行前:</span>
              <div class="jobLevelAndRank" v-if="rzArr.length">
                <div class="Workingunit" v-for="item in rzArr" :key="item.ZwID">
                  <div>干部任职单位:&ensp;<span>{{ item.dw }}</span></div>
                  <div>任职岗位:&ensp;<span>{{ item.zwmc }}</span></div>
                  <el-checkbox v-model="item.selected" class="el-checkbox">删除职数</el-checkbox>
                  <img src="../../assets/images/rm/warn.png" style="width:18px;height: 18px;margin-top: 5px;">
                </div>

              </div>
              <div v-else>
                该干部目前尚未有任何任职单位！
              </div>
            </div>

这段代码是一个Vue.js组件的模板代码，用于显示干部的任职单位和岗位信息。在执行前，代码会检查干部的任职信息是否存在，如果存在，则会在页面上显示干部的任职单位和岗位信息（ v-if="rzArr.length"），并且提供一个删除职数的复选框。如果干部的任职信息不存在，(v-else)则会在页面上显示“该干部目前尚未有任何任职单位！”的提示信息。

如果你想要在你的代码中使用这段代码，你需要将它添加到你的Vue.js组件的模板中，并且定义一个rzArr数组，用来存储干部的任职信息。然后，你需要在rzArr数组中添加干部的任职信息，就可以在页面上显示干部的任职单位和岗位信息了。

通过v-model="item.selected"来确定我点击的该条记录，而后端所返回的数据没有selected。此时我们拿到后端数据后，手动添加：

  this.rzArr = resData.Data.O_CadreRzInfos.map(v => {
            return {
              dw: v.dw,
              zwmc: v.zwmc,
              zwID: v.ZwID,
              selected: false
            };
          });

然后我们拿到点击职数的人的id

 this.ZWIDS = this.rzArr
        .filter(value => {
          return value.selected;
        })
        .map(value => {
          return value.zwID;
        });
      console.log("this ZWIDS", this.ZWIDS);

用于将干部的任职信息中被选中的职数的zwID属性提取出来，并存储在this.ZWIDS数组中。具体实现方法是通过Vue.js的filter和map方法来实现的。其中，filter方法用于过滤出被选中的职数，map方法用于将职数的zwID属性提取出来，并存储在this.ZWIDS数组中。此时我们的需求就完成了。