diff --git a/src/components/Icon.vue b/src/components/Icon.vue index 798e72d..01c778f 100644 --- a/src/components/Icon.vue +++ b/src/components/Icon.vue @@ -7,19 +7,23 @@ import Vue, { CreateElement } from 'vue' /// 常量(UPPER_CASE), 单例/变量(camelCase), 函数(无副作用,camelCase) const REG_NUM = /\s*([\d.]+)(\w+)/ const loadingStatus = Vue.observable({ state: 0 }) -import(/* webpackChunkName: "icon" */ '@/scss/font/fonts').then(res => { - const container = document.createElement('i') - container.innerHTML = - '' - res.default = null - document.body.appendChild(container.firstChild) - loadingStatus.state = 1 -}).catch(err => { - console.error(err) - loadingStatus.state = 2 -}) +import(/* webpackChunkName: "icon" */ '@/scss/font/fonts') + .then(res => { + const container = document.createElement('i') + container.innerHTML = + '' + res.default = null + document.querySelector('html').appendChild(container.firstChild) + setTimeout(() => { + loadingStatus.state = 1 + }) + }) + .catch(err => { + console.error(err) + loadingStatus.state = 2 + }) function isSymbol(id: string) { return document.getElementById(id) // symbol 只保留不能字体图标呈现的, 比如带颜色等的 @@ -70,24 +74,25 @@ export default { const imgIcon = this.imgIcon if (imgIcon) { const size = this.size - return + return ( + + ) } let icon = this.icon if (isSymbol(icon)) { switch (loadingStatus.state) { case 1: - return - {h('use', { attrs: { 'xlink:href': '#' + icon } })} - + return ( + + {h('use', { attrs: { 'xlink:href': '#' + icon } })} + + ) case 2: return default: @@ -95,10 +100,7 @@ export default { } } - return + return }, }