首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Vue 3中的抛出错误

Vue 3中的抛出错误
EN

Stack Overflow用户
提问于 2022-02-11 05:21:50
回答 1查看 1.2K关注 0票数 2

我试图在我的fontawesome 5项目中从6升级到vue 3,但是当我试图加载一个图标时,它会抛出以下错误:

代码语言:javascript
运行
复制
Vue warn]: Unhandled error during execution of render function 
  at <FontAwesomeIcon class="icon" icon= Array(2) > 
  at <Benefits> 
  at <App>
warn @ app.js:29973
app.js:30153 Uncaught TypeError: Cannot read properties of undefined (reading 'icon')
    at Proxy.render (app.js:12923:26)
    at renderComponentRoot (app.js:23853:44)
    at ReactiveEffect.componentUpdateFn [as fn] (app.js:27701:57)
    at ReactiveEffect.run (app.js:22221:29)
    at setupRenderEffect (app.js:27827:9)
    at mountComponent (app.js:27610:9)
    at processComponent (app.js:27568:17)
    at patch (app.js:27169:21)
    at mountChildren (app.js:27356:13)
    at mountElement (app.js:27265:17)
app.js:29973 [Vue warn]: Unhandled error during execution of mounted hook 
  at <SvgProgressLine> 
  at <App>
warn @ app.js:29973
2app.js:35773 Uncaught (in promise) TypeError: Cannot read properties of null (reading 'getTotalLength')
    at app.js:35773:29
    at callWithErrorHandling (app.js:30090:22)
    at callWithAsyncErrorHandling (app.js:30099:21)
    at Array.hook.__weh.hook.__weh (app.js:25359:29)
    at flushPostFlushCbs (app.js:30288:47)
    at flushJobs (app.js:30333:9)

我遵循了文档并在packages.json中安装了这些版本

代码语言:javascript
运行
复制
"@fortawesome/fontawesome-svg-core": "^1.3.0-beta3",
"@fortawesome/free-brands-svg-icons": "^6.0.0-beta3",
"@fortawesome/free-regular-svg-icons": "^6.0.0-beta3",
"@fortawesome/free-solid-svg-icons": "^6.0.0-beta3",
"@fortawesome/vue-fontawesome": "^2.0.6",

它们是像这样在app.js中导入的:

代码语言:javascript
运行
复制
import {library} from '@fortawesome/fontawesome-svg-core'
import {FontAwesomeIcon} from '@fortawesome/vue-fontawesome'
import {faEnvelope, faCog, faGlobe, faServer, faKey, faSearch, faWrench, faCommentDollar, faHandsHelping, faChartBar, faExclamationTriangle, faLandmark, faUserCheck} from '@fortawesome/free-solid-svg-icons'

library.add(faEnvelope, faCog, faGlobe, faServer, faKey, faSearch, faWrench, faCommentDollar, faHandsHelping, faChartBar, faExclamationTriangle, faLandmark, faUserCheck);

createApp(app)
    .component('fa', FontAwesomeIcon)
    .use(VueSmoothScroll)
    .use(i18n)
    .mount("#app");

并在vue file中显示如下:

代码语言:javascript
运行
复制
<fa class="icon" :icon="[ 'fa', 'landmark' ]"></fa>

我做错了什么?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-02-11 06:08:20

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/71075697

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档