[Vuejs]-Quasar framework- VueJS

1👍

You need to define data props. Rows of data to display(:data) and you can customize the body of the table by using body slot. You can get index by using __index.

<q-table
          title="Task List Of The Day"
          :columns="test_columns"
          row-key="name"
          :pagination="pagination"
          :data="absensi"
        >
          <template slot="body" slot-scope="props">
            <q-tr :props="props">
              <q-td key="project" :props="props">{{ props.row.project }}</q-td>
              <q-td key="activity" :props="props">{{ props.row.activity }}</q-td>
              <q-td key="remaks" :props="props">{{ props.row.remaks }}</q-td>
              <q-td key="action" :props="props">
                index: {{props.row.__index}}
                <q-btn color="red" dense flat icon="eva-trash-2-outline" @click="deleteabs(props.row.__index)"/>
              </q-td>
            </q-tr>
          </template>
        </q-table>

Leave a comment