bhaveshpatel200 / vue3-datatable

vue3-datatable is a powerful component for creating dynamic and customizable data tables. It supports large amounts of data, sorting, pagination, and filtering and highly customizable
MIT License
134 stars 19 forks source link

vue3 datatable slot loop template of rows ? #40

Closed bombkiml closed 5 months ago

bombkiml commented 5 months ago
<template>

  <vue3-datatable :rows="rows" :columns="cols">

      <!-- 

      Please let me know ?, Can i loop template tag with v-for ?

      Example :

      <template v-for="c in 10" #code="data">
        X0{{ c }}
      </template>

      -->

  </vue3-datatable>

<template>
<script setup>
    import { ref } from "vue";
    import Vue3Datatable from "@bhplugin/vue3-datatable";
    import "@bhplugin/vue3-datatable/dist/style.css";

    const cols = ref([
      { field: "id", title: "ID", width: "90px", filter: false },
      { field: "code", title: "X Code" },
      { field: "name", title: "Name" },
      { field: "username", title: "Username" },
      { field: "email", title: "Email" },
    ]);

    const rows = ref([
      {
         id: 1,
        code: 'X01',
         name: "Leanne Graham",
         username: "Bret",
         email: "Sincere@april.biz",
       },
       {
         id: 2,
        code: 'X02',
         name: "John Doe",
         username: "John",
         email: "John@april.biz",
       },
     ]);

</scriptt>
bhaveshpatel200 commented 5 months ago

Hi bombkiml,

Yes, you can do anything inside slots.