HTML Tirar print somente da tabela

Enzo Vaz · 17 de dezembro de 2019

Pessoal preciso de uma ajuda, agradeço desde já!

Estou tentado tirar um print da tabela, somente ela, pois quando tiro print sai a tela inteira como header, menu, etc. Alguém sabe como faz ?

<template>

    <div class ="consulta-register-aparelho">

        <h1> Consulta Componente</h1>



//Esses metodos não deram certo

<form>

  <a class="btn btn-success" href="javascript:window.print()">Print</a>

<input type = "button" value = "Imprima esta página" onClick = "window.print ()" > 



</form>



        <b-col lg="6" class="my-1">

        <b-form-group

          label="Filter"

          label-cols-sm="3"

          label-align-sm="right"

          label-size="sm"

          label-for="filterInput"

          class="mb-0"

        >

          <b-input-group size="sm">

            <b-form-input

              v-model="filter"

              type="search"

              id="filterInput"

              placeholder="Digite para procurar!"

            ></b-form-input>

            <b-input-group-append>

              <b-button :disabled="!filter" @click="filter = ''">Clear</b-button>

            </b-input-group-append>

          </b-input-group>

        </b-form-group>

      </b-col>

            <div id="div1"> 

            <b-table hover striped :items="responsaveis" :fields="fields" :filter="filter" :print="print">

            </b-table>

            </div>

    </div>

</template>




<script>

import { baseApiUrl } from '@/global'

import axios from 'axios'



export default {

    name: 'RegisterResponsavel',

    data: function() {

        return {

            mode: 'save',

            responsavel: {},

            responsaveis: [],

            fields: [

                { key: 'id', label: 'Código', sortable: true },

                { key: 'nome', label: 'Nome', sortable: true }, 

                { key: 'email', label: 'Email', sortable: true }, 

                { key: 'nome_local', label: 'Localização', sortable: true}

            ],

        }

    },

    methods: {

        loadResponsaveis() {

            const url = `${baseApiUrl}/responsaveis`

            axios.get(url).then(res => {

                this.responsaveis = res.data

            })

        },

        onFiltered(filteredItems) {

        // Trigger pagination to update the number of buttons/pages due to filtering

        this.totalRows = filteredItems.length

        this.currentPage = 1

        },

      

        loadResponsavel(responsavel, mode = 'save') {

            this.mode = mode

            this.responsavel = { ...responsavel }

        }

    },

    mounted() {

        this.loadResponsaveis()

    }

}

</script>



<style>



</style>