4

前提:一不小心搭建了vue3项目,vue-pdf最新版本为4.2.0,不是针对vue3构建的

问题1:TypeError: h is not a function
image.png
原因:h在vue3的render函数中不再以参数形式出现,需要手动导入
解决:

  1. 将vue-pdf中的render: function (h)替换为render: function (),然后手动导入import { h } from 'vue'
  2. 在vue-pdf的依赖vue-resize-sensor中同样将render: function(create)替换为render: function(),然后手动导入import { h as create } from 'vue'

问题2:ReferenceError: $emit is not defined
image.png
解决:

  1. npm install vue-happy-bus --save,然后手动导入

    import { $on, $emit } from 'vue-happy-bus'
  1. . this.$on替换为$onthis.$emit替换为$emit

问题3:修改了vue-pdf和vue-resize-sensor中的源码如何上传到自己的项目
解决:

  1. npm install patch-package --save-dev
  2. npx patch-package vue-pdf
  3. npx patch-package vue-resize-sensor
  4. 修改package.json
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint",
    "postinstall": "patch-package"//增加这个命令
  },

遗留问题:对于vue-pdf中的生命周期钩子函数不知道怎么处理,将destroyed替换为unmounted,destroy()替换为unmount()之后仍然报错,暂时注释了


洛洛尔爱吃蛋包饭
9 声望3 粉丝

星辰大海