vue-easy-table的rowkey设置及行单选

本文主要是介绍vue-easy-table的rowkey设置及行单选，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

地址：https://happy-coding-clans.github.io/vue-easytable/#/zh/doc/table/row-radio

 <ve-table
      style="width:100%"
      :columns="columns"
      :table-data="tableData"
      :radio-option="radioOption"
      row-key-field-name="rowKey" // rowkey为数据源的唯一值，后端给定，或者自己加上去。
    />
``
 tableData: [
          {
            rowKey: 1001,
            name: "John",
            date: "1900-05-20",
            hobby: "coding",
            address: "No.1 Century Avenue, Shanghai",
          },
          {
            rowKey: 1002,
            name: "Dickerson",
            date: "1910-06-20",
            hobby: "coding",
            address: "No.1 Century Avenue, Beijing",
          },
        ],
      };
  

```javascript
 columns: [
 // 三列数据，多一列是单选框，fiedl和title设置为空
          {
            field: "",
            key: "a",
            // type=radio
            type: "radio",
            title: "",
            width: 50,
            align: "center",
          },
          { field: "name", key: "b", title: "Name", width: 200, align: "left" },
          { field: "hobby", key: "c", title: "Hobby", width: 300, align: "left" },
          { field: "address", key: "d", title: "Address", width: "", align: "left" },

这篇关于vue-easy-table的rowkey设置及行单选的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！