<div id="app" class="container">
                    <b-table
                      show-empty
                      stacked="md"
                      :items="items"
                      :fields="fields"
                      :current-page="currentPage"
                      :per-page="perPage"
                      :filter="filter"
                      :sort-by.sync="sortBy"
                      :sort-desc.sync="sortDesc"
                      :sort-direction="sortDirection"
                      @filtered="onFiltered">

                        <template slot="id">

                        </template>

                        <template slot="actions" slot-scope="item">
                            <b-button size="sm" @click="info(items.id)" class="mr-1">
                              <span class="glyphicon glyphicon-edit"></span>
                            </b-button>
                            <b-button size="sm" @click="info(items.id, $event.target)" class="mr-1">
                              <span class="glyphicon glyphicon-remove"></span>
                            </b-button>
                        </template>
              </b-container>
            </template>
</div>

var app = new Vue({
    el: "#app",
    delimiters: ['${','}'],
    components: {
        vuejsDatepicker
    },
    data() {
      return {
        items: [],
        fields: [
          { key: 'id', label: 'Id', sortable: true, sortDirection: 'desc', class: 'text-center' },
          { key: 'tipo', label: 'Tipo', sortable: true, class: 'text-center' },
          { key: 'descripcion', label: 'Descripción', sortable: true, class: 'text-center' },
          { key: 'razaanimal.nombre', label: 'Raza', sortable: true, class: 'text-center' },
          { key: 'fecha', label: 'Fecha', sortable: true, class: 'text-center' },
          { key: 'actions', label: 'Acciones', class: 'text-center' }
        ],
        totalRows: 1,
        currentPage: 1,
        perPage: 5,
        pageOptions: [5, 10, 15],
        sortBy: null,
        sortDesc: false,
        sortDirection: 'asc',
        filter: null,
        infoModal: {
          id: '',
          title: '',
          content: ''
        }
      }
    },
    computed: {
      sortOptions() {
        // Create an options list from our fields
        return this.fields
        //alert(this.fields)
          .filter(f => f.sortable)
          .map(f => {
            return { text: f.label, value: f.key }
          })
      }
    },
    mounted() {

      this.getMovimientos()

    },
    methods: {
        getMovimientos: function() {
            this.loading = true;
            this.$http.get('/control/movimiento/api/mov/').then(response => {
                this.items = response.data;
                //alert(this.items);
                this.loading = false;
            }, response => {
                this.loading = false;
                console.log(err);
            });
        },
        info(id) {
            alert(id)
            this.infoModal.title = 'Row index: ${id}'
            this.infoModal.content = JSON.stringify(id, null, 2)
            this.$root.$emit('bv::show::modal', this.infoModal.id)
        },
        resetInfoModal() {
            this.infoModal.title = ''
            this.infoModal.content = ''
        },
    }
});

<template slot="actions" slot-scope="item">
                **En esta parte--->**<b-button size="sm" @click="info(items.id)" class="mr-1">
                                  <span class="glyphicon glyphicon-edit"></span>
                                </b-button>
                                <b-button size="sm" @click="info(items.id, $event.target)" class="mr-1">
                                  <span class="glyphicon glyphicon-remove"></span>
                                </b-button>
                            </template>