[Vuejs]-Make a Bootstrap Vue table to select max 3 items

0👍

One solution is unselected the row manually.

 onRowSelected(items) {
    const limit = 3
    let selected = items
    if (this.items.length > limit) {
      selected = items.slice(0, limit)
    }
    const toUnselected = items.slice(limit)
    toUnselected.forEach(item => {
      const idx = this.items.findIndex(it => item == it)
      if (idx >= 0) {
        this.$refs.selectableTable.unselectRow(idx)
      }
    })
    this.selected = items
  }

Note that you need to add ref=selectableTable to the <b-table>

You can check demo in codepen here

Leave a comment