vue-html-to-paper 与 Vue3

Question

我想试试 vue-html-to-paper，我根据文档做了最简单的设置。不过我使用的是 Vue3。

npm install vue-html-to-paper

//main.js
[...]
import VueHtmlToPaper from "vue-html-to-paper";

createApp(App)
  .use(VueHtmlToPaper)
  .mount("#app");

还有我的组件：

<template>
  <div>
    <div id="example">
      Hello World
    </div>

    <button @click="print">
      Print
    </button>
  </div>
</template>

<script>
export default {
  name: "my_component",

  methods: {
    print: function() {
      this.$htmlToPaper("example");
    },
  },
</script>
[...]

在开发时，我在控制台 [...] Cannot set property '$htmlToPaper' of undefined [...] 中收到错误消息。我做错了什么？

谢谢，不胜感激。

Answer 1

它 uses Vue.prototype 所以它不能与 Vue 3 一起使用，除非它得到修复。如果你想自己修复它，你可以分叉 repo。

为此，请替换此❌：

install (Vue, options = {}) {
    Vue.prototype.$htmlToPaper = (el, localOptions, cb = () => true) => {

有了这个对 Vue 2 和 Vue 3 都有效的 ✅：

install (_i, options = {}) {
    let globals = _i.prototype || _i.config.globalProperties;
    globals.$htmlToPaper = (el, localOptions, cb = () => true) => {

使用 Vue 3 安装插件时，请遵循 docs，但将 Vue.use 替换为 app.use。