Vue html-to-paper打印b表导致GIANT排序箭头出现

Question

我正在尝试使用 vue-html-to-paper 从网页打印表格，但是当我尝试打印时出现巨大的箭头。

这是打印前的预览，一切正常。

但是当我打印时，我得到了这个。

我很确定这是因为 b 表的可排序箭头图标，因此我试图删除 B 表中的所有可排序功能。但它没有效果。这是我当前的代码，我只使用引导程序，没有自定义 css。

这是我的表格代码：

            <b-table
              :data="selectedShipment.shipmentDetailList"
              :header-props="{ sortIcon: null }"
            >
              <b-table-column
                field="productId"
                label="ID Produk"
                v-slot="props"
              >
                {{ props.row.product.productId }}
              </b-table-column>
              <b-table-column
                field="productName"
                label="Nama Produk"
                v-slot="props"
              >
                {{ props.row.product.productName }}
              </b-table-column>
              <b-table-column
                field="quantity"
                label="Kuantitas Dalam Kiriman"
                v-slot="props"
              >
                {{ props.row.quantity }}
              </b-table-column>
              <b-table-column
                field="receivedQuantity"
                label="Kuantitas Yang Diterima"
                v-slot="props"
              >
                {{ props.row.receivedQuantity }}
              </b-table-column>
            </b-table>
            </div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-danger" data-dismiss="modal">
              Cancel Shipment
            </button>
            <button type="button" class="btn btn-success" data-dismiss="modal" @click="print">
              Print Shipment
            </button>
          </div>
        </div>

这是我的打印方法：

print() {
      // Pass the element id here
      this.$htmlToPaper("printShipmentBodyModal", () => {});
      console.log("Printing completed or was cancelled!");
    },

Answer 1

这是由一个名为 fontawsome for buefy 的 npm 插件引起的，它的图标没有被 CSS 设置样式，解决方案是删除它们。