[Vuejs]-How to add a link to a Vuikit (Vuejs) table?

by

0👍

I was helped out with the below pen from one of the contributors.

HTML

<div id="app" class="uk-padding">

  <vk-table :data="paginatedData" narrowed>
    <vk-table-column-select></vk-table-column-select>
    <vk-table-column title="Vendor Name" cell="name"></vk-table-column>

    <vk-table-column title="Link">
      <a href="mystaticurl">Static URL</a>
    </vk-table-column>

    <vk-table-column title="Link">
      <a slot-scope="{ row }" :href="row.link">{{ row.link }}</a>
    </vk-table-column>

  </vk-table>

</div>

JS

new Vue({
  el: '#app',
  data: () => ({
    paginatedData: [
      {name: 'row1', link: 'link1'},
      {name: 'row2', link: 'link2'}
    ]
  })
})

Leave a comment