Vue列表,点击一行时选中这一行对应的复选框

<el-table
  :data="planList"
  border
  height="440px"
  style="width: 100%"
  @selection-change="handleSelectionChange"
  @row-click="clickRow" 
  ref="table"
>
  <el-table-column type="selection" width="50" align="center" />
  <el-table-column  prop="plancode" label="报告编号" sortable width="180">el-table-column>
  <el-table-column  prop="planname" label="报告名称" sortable width="180">el-table-column>
  <el-table-column  prop="rateyear" label="报送年度" sortable width="180">el-table-column>
  <el-table-column  prop="rptenddate" label="报告结束日期" sortable width="180">el-table-column>
  <el-table-column  prop="createdtime" label="创建时间" sortable width="180">el-table-column>
  <el-table-column  prop="modifytime" label="修改时间" sortable width="180">el-table-column>
  <el-table-column prop="status" label="报告状态" :formatter="statusFormat" width="180">el-table-column>
el-table>
methods: {
  clickRow(row){
  this.$refs.table.toggleRowSelection(row);
  }
}

如上,中,想要点击一行任意位置,选中这一行所对应的复选框,那单写在某一或每一都不太合适,所以我们可以直接在上绑定一个方法@row-click="clickRow" ,传入row参数,通过$refs获取table列表的dom元素,从而获取到点击的是哪一行

你可能感兴趣的:(Vue,学习记录,知识点,vue)