zoukankan      html  css  js  c++  java
  • elementUI table表格加入单选框

    <template>
      <div class="page">
        <el-table
          :data="tableData"
          ref="singleTable"
          highlight-current-row
          border
          style=" 100%"
        >
          <el-table-column label="" width="40">
            <template scope="scope">
              <el-radio
                :label="scope.$index"
                v-model="currentRow"
                @change.native="getCurrentRow(scope.row)"
                style="color: #fff; padding-left: 10px; margin-right: -25px"
              ></el-radio>
            </template>
          </el-table-column>
          <el-table-column prop="date" label="日期"> </el-table-column>
          <el-table-column prop="name" label="姓名"> </el-table-column>
          <el-table-column prop="address" label="地址"> </el-table-column>
        </el-table>
      </div>
    </template>
    <script>
    export default {
      data() {
        return {
          currentRow: 0,
          tableData: [
            {
              date: "2016-05-02",
              name: "王小虎",
              index: "1",
              address: "上海市普陀区金沙江路 1518 弄",
            },
            {
              date: "2016-05-04",
              name: "王小虎",
              index: "2",
              address: "上海市普陀区金沙江路 1517 弄",
            },
            {
              date: "2016-05-01",
              name: "王小虎",
              index: "3",
              address: "上海市普陀区金沙江路 1519 弄",
            },
            {
              date: "2016-05-03",
              name: "王小虎",
              index: "3",
              address: "上海市普陀区金沙江路 1516 弄",
            },
          ],
        };
      },
      methods: {
        getCurrentRow(row) {
          console.log(row);
        },
      },
    };
    </script>
  • 相关阅读:
    14.3.1选择选项
    14.3 选择框表单
    14.2.4HTML5约束API验证
    input标签之外是否一定添加form标签
    14.2.3自动切换焦点
    php设计模式---抽象模式模式
    php设计模式---简单工厂模式
    git基本教程,每天更新
    第5章 卷积神经网络
    第3章 深度学习基础
  • 原文地址:https://www.cnblogs.com/jervy/p/14340947.html
Copyright © 2011-2022 走看看