custom-index.vue 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. <template>
  2. <el-table :data="tableData" style="width: 100%">
  3. <el-table-column type="index" :index="indexMethod" />
  4. <el-table-column prop="date" label="Date" width="180" />
  5. <el-table-column prop="name" label="Name" width="180" />
  6. <el-table-column prop="address" label="Address" />
  7. </el-table>
  8. </template>
  9. <script lang="ts" setup>
  10. const indexMethod = (index: number) => {
  11. return index * 2
  12. }
  13. const tableData = [
  14. {
  15. date: '2016-05-03',
  16. name: 'Tom',
  17. state: 'California',
  18. city: 'Los Angeles',
  19. address: 'No. 189, Grove St, Los Angeles',
  20. zip: 'CA 90036',
  21. tag: 'Home',
  22. },
  23. {
  24. date: '2016-05-02',
  25. name: 'Tom',
  26. state: 'California',
  27. city: 'Los Angeles',
  28. address: 'No. 189, Grove St, Los Angeles',
  29. zip: 'CA 90036',
  30. tag: 'Office',
  31. },
  32. {
  33. date: '2016-05-04',
  34. name: 'Tom',
  35. state: 'California',
  36. city: 'Los Angeles',
  37. address: 'No. 189, Grove St, Los Angeles',
  38. zip: 'CA 90036',
  39. tag: 'Home',
  40. },
  41. {
  42. date: '2016-05-01',
  43. name: 'Tom',
  44. state: 'California',
  45. city: 'Los Angeles',
  46. address: 'No. 189, Grove St, Los Angeles',
  47. zip: 'CA 90036',
  48. tag: 'Office',
  49. },
  50. ]
  51. </script>