window.print()方法调起浏览器打印

*初级小白*~

于 2022-09-14 09:33:59 发布

阅读量582

点赞数

CC 4.0 BY-SA版权

分类专栏：项目实战遇到的问题文章标签： javascript 前端 vue.js

本文链接：https://blog.youkuaiyun.com/ScumStudy/article/details/126846200

该博客介绍了如何在Vue.js中创建一个包含表格数据的组件，并实现点击按钮打印表格内容的功能。代码示例展示了如何设置表格样式、响应式布局以及使用两种不同的打印方法。同时，博客还提供了数据结构和CSS样式来确保表格的显示效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

 
<template>
  <div><button @click="del">打印</button></div>
  <div ref="printHtml">
    <div class="wraper">
      <div>
        <table border="1px" cellspacing="0">
          <thead>
            <tr>
              <th rowspan="2">1</th>
              <th rowspan="2">2</th>
              <th rowspan="2">3</th>
              <th rowspan="2">4</th>
              <th rowspan="2">5</th>
              <th rowspan="2">6</th>
              <th rowspan="2">7</th>
              <th rowspan="2">8</th>
              <th rowspan="2">9</th>
              <th rowspan="2">0</th>
              <th rowspan="2">11</th>
              <th rowspan="2">12</th>
              <th rowspan="2">13</th>
              <th rowspan="2">14</th>
              <th rowspan="2"&