vue-pdf vuePdfNoSss.vue resize-sensor.vue Error in v-on handler: “TypeError: Cannot read propertie

最新推荐文章于 2024-04-16 10:49:57 发布
最新推荐文章于 2024-04-16 10:49:57 发布
阅读量1.9k 收藏 2
点赞数 3
分类专栏： pits 文章标签： vue.js pdf javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qubes/article/details/128256000
版权

vue-pdf vuePdfNoSss.vue resize-sensor.vue Error in v-on handler: “TypeError: Cannot read properties of undefined (reading ‘catch’)”

problem

使用vue-pdf解析pdf文件，控制台出现报错
从traceback 看vue组件 -> vud-pdf vuePdfNoSss.vue-> vue-resize-sensor 导致

vue.esm.js:5136 [Vue warn]: Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'catch')"

found in

---> <ResizeSensor> at node_modules/vue-resize-sensor/src/resize-sensor.vue
       <Pdf> at node_modules/vue-pdf/src/vuePdfNoSss.vue
         <App> at src/components/test/index.vue
           <Home> at src/views/Home.vue

reason

原因：到底哪里出错了不清楚，可能是vue版本和vue-pef版本不兼容导致

solution

网上找到的方案，亲测可用
调整vue-pdf版本

  • 调整前版本：“^4.3.0”,
  • 调整后版本：“4.2.0”,

具体指令：
yarn remove vue-pdf
yarn add vue-pdf@4.2.0
yarn add pdfjs-dist@2.5.207

snowDreamzzz
关注
  • 3
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
VueResizeSensor:一个支持resize事件的Vue容器
05-27
VueResizeSensor 一个支持resize事件的Vue容器。 适用于Vue 2和3。 依存关系 设置 npm npm i @seregpie/vue-resize-sensor import VueResizeSensor from '@seregpie/vue-resize-sensor' ; 浏览器 <!-- if using Vue 2 --> < script src =" https://unpkg.com/vue@2 " > </ script > < script src =" https://unpkg.com/@vue/composition-api " > </ script > <!-- if using Vue 3 --> < script src =" https://unpkg.com/vue@3 " > </ script > < scri
vue-resize-sensor-用于检测容器大小的组件（基于事件）-Vue.js开发
05-27
vue-resize-sensor检测容器大小。 基于事件的事件，没有[removed]，没有时间间隔/超时检测，没有CSS修改，没有Javascript-Framework vue-resize-sensor检测到容器的大小调整。 基于事件的事件，没有[removed]，没有时间间隔/超时检测，没有CSS修改，没有Javascript-Framework依赖示例 API props initial Boolean请求一个初始大小事件。 events @resize Object一个大小对象{width，height}浏览器支持与Vue.js相同的浏览器支持2注意，由于v2.x，该脚本导出为esm。
qiankun微前端子应用加载 vue-pdf 时产生跨域问题.
最新发布
weixin_69656067的博客
04-16 827
报错描述: Failed to construct 'Worker': Script at xxx cannot be accessed from origin xxx。
Error in v-on handler: “TypeError: Cannot read properties of undefined (reading ‘clearFiles‘)“
qq_64180379的博客
08-12 2万+
Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'clearFiles')"
vue报错解决：Error in v-on handler (Promise/async): “TypeError: Cannot read properties ofundefined
热门推荐
小张与BUG
09-23 7万+
vue报错解决 [Vue warn]: Error in v-on handler (Promise/async): "TypeError: Cannot read properties of undefined (reading 'code ')” axios可以获取数据，控制台输出为undefined
vue-pdf报错Cannot read properties of undefined (reading ‘catch‘)“ found in
CCAHSC的博客
07-06 1724
直接把package.json中的 vue-pdf删除添加下面的两行代码然后重新执行npm i 重新跑一边项目就可以了。根本原因就是vue-pdf版本和vue版本不一致。再安装低版本的vue-pdf。先卸载现有的vue-pdf。
vue 中 div resize 监听ResizeSensor使用
技术改变生活
09-09 2049
1.安装resize-observer-polyfill npm install resize-observer-polyfill 2.引用+监听使用，我再在mounted中了 var ResizeSensor = require("css-element-queries/src/ResizeSensor") // 引用 var element = this.$refs.main // dom注意ref=“main”不要写在组件上，容易无效 // 监
vue-qrcode：Vue.js的QR码组件
02-06
vue-qrcode Vue 3的QR代码组件，基于 。 主要档案 dist/ ├── vue-qrcode.js (UMD, default) ├── vue-qrcode.min.js (UMD, compressed) ├── vue-qrcode.esm.js (ECMAScript Module) └── vue-qrcode.esm....
vue-websocket：Vue.js的简单websocket（socket.io）插件
02-06
npm $ npm install -S vue-websocket手册下载生产文件。 该链接是在该项目的dist目录中找到的同一文件的镜像。用法注册插件。 默认情况下，它将连接到/ ： import VueWebsocket from "vue-websocket" ;Vue . use ( ...
vue-countdown：Vue.js的倒计时组件
02-06
├── vue-countdown.js (UMD) ├── vue-countdown.min.js (UMD, compressed) ├── vue-countdown.common.js (CommonJS, default) └── vue-countdown.esm.js (ES Module) 入门 安装 npm install @...
vue-grid-layout：Vue.js的可拖动和可调整大小的网格布局
02-06
vue-grid-layout是的网格布局系统，例如 。 受极大启发 产品特点 可拖动的小部件 可调整大小的小部件 静态小部件 边界检查以进行拖动和调整大小 可以在不重建网格的情况下添加或删除小部件 布局可以序列化和还原 ...
vue实现在线预览pdf文件和下载（pdf.js）
10-15
主要为大家详细介绍了vue实现在线预览pdf文件和下载，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
vue实现pdf文档在线预览功能
10-15
主要为大家详细介绍了vue实现pdf文档在线预览功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
解决vue 给window添加和移除resize事件遇到的坑
10-15
主要介绍了解决vue 给window添加和移除resize事件遇到的坑，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue-qr：Awesome-qr.js的Vue 2.x组件
02-06
vue-qr 的Vue 2.x组件 您只需要Vue.js的一个qr代码组件！ 注意 不支持IE不支持IE浏览器 样例 尝试使用智能手机扫描以下这些QR码。 例子1 例子2 例子3 例子4 演示版 运行npm run dev或yarn dev npm run dev或...
使用vue-pdf插件导致 Cannot read properties of undefined (reading ‘catch‘)解决办法
woxingliu2018的博客
07-12 2305
vue-pdf
Vue 监听 window.resize
司马懿的西山居
04-08 2981
&lt;!doctype html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="utf-8"/&gt; &lt;title&gt;Vue中绑定全局事件onresize&lt;/title&gt; &lt;meta name="viewport" con
vue-pdf组件报错vue-pdf Cannot read properties of undefined (reading ‘catch‘)
summer_gf的博客
02-22 7328
项目场景： 使用vue-pdf组件实现文件预览功能 问题描述： 安装依赖后报错vue-pdf Cannot read properties of undefined (reading 'catch') TypeError: Cannot read properties of undefined (reading 'catch') at PDFJSWrapper.renderPage (pdfjsWrapper.js?a068:196) at VueComponent.resize (co
vue-pdf 问题记录
weixin_42535013的博客
11-04 1534
vue-pdf 踩坑记录。。。
vue-pdf Error in v-on handler: "TypeError: Cannot read properties of undefined (reading 'catch')"
08-16
问题中提到的错误来源于使用vue-pdf解析pdf文件时，控制台报错"TypeError: Cannot read properties of undefined (reading 'catch')"。根据引用和引用可知，这个错误可能是由于在vue组件中，通过引用vue-pdf组件和vue-resize-sensor组件出现了问题。 要解决这个错误，你可以尝试以下几个步骤： 1. 确保你已经正确引入了vue-pdf和vue-resize-sensor组件，并将其正确注册在你的Vue组件中。 2. 检查你的代码，确保你正确使用了vue-pdf和vue-resize-sensor组件的语法和属性。特别注意是否正确使用了v-on指令，并且指定了正确的事件处理函数。 3. 确保你的环境中已经安装了vue-pdf和vue-resize-sensor的依赖项。你可以通过检查你的package.json文件或运行npm list命令来确认。 4. 如果以上步骤都没有解决问题，你可以尝试更新vue-pdf和vue-resize-sensor的版本，或者查看它们的文档和官方资源，看是否有其他用户报告了相似的问题，并找到解决方案。 希望以上步骤能够帮助你解决这个错误。如果问题仍然存在，请提供更多的代码和错误信息，以便我们更好地帮助你解决问题。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [vue-pdf vuePdfNoSss.vue resize-sensor.vue Error in v-on handler: “TypeError: Cannot read propertie](https://blog.csdn.net/qubes/article/details/128256000)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *3* [Sawyer-zh#study-note#Vue-js路由报错TypeError-Cannot-read-property-c-](https://download.csdn.net/download/weixin_35829279/86254477)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值