d0zingcat/NotionNext
1
0
Fork 0
mirror of https://github.com/d0zingcat/NotionNext.git synced 2026-05-14 15:09:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix iconfont not found

Browse Source
This commit is contained in:
tangly1024
2025-04-11 22:34:15 +08:00
parent f16b7b7b1e
commit 37b6c5b3dd
1 changed files with 24 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
components/IconFont.js
View File

@@ -10,30 +10,34 @@ export default function IconFont() {
const router = useRouter()
useEffect(() => {
loadExternalResource('/webfonts/iconfont.js').then(u => {
console.log('iconfont loaded')
loadExternalResource('/webfonts/iconfont.js')
.then(u => {
console.log('iconfont loaded');
// 查找所有 <i> 标签且 class 包含 'icon-'
const iElements = document.querySelectorAll('i[class*="icon-"]');
iElements.forEach(element => {
const className = Array.from(element.classList).find(cls => cls.startsWith('icon-'));
if (className) {
// 创建新的 <svg> 元素
const svgElement = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
svgElement.setAttribute('class', 'icon');
svgElement.setAttribute('aria-hidden', 'true');
// 查找所有 <i> 标签且 class 包含 'icon-'
const iElements = document.querySelectorAll('i[class*="icon-"]');
iElements.forEach(element => {
const className = Array.from(element.classList).find(cls => cls.startsWith('icon-'));
if (className) {
// 创建新的 <svg> 元素
const svgElement = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
svgElement.setAttribute('class', 'icon');
svgElement.setAttribute('aria-hidden', 'true');
const useElement = document.createElementNS('http://www.w3.org/2000/svg', 'use');
useElement.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', `#${className}`);
svgElement.appendChild(useElement);
const useElement = document.createElementNS('http://www.w3.org/2000/svg', 'use');
useElement.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', `#${className}`);
svgElement.appendChild(useElement);
// 替换原来的 <i> 元素
element.replaceWith(svgElement);
console.log(`Replaced <i> with class "${className}" to <svg>`);
}
// 替换原来的 <i> 元素
element.replaceWith(svgElement);
console.log(`Replaced <i> with class "${className}" to <svg>`);
}
});
})
.catch(error => {
console.warn('Failed to load iconfont.js:', error);
});
})
}, [router])
}, [router]);
return <style jsx global>
{`
@@ -43,12 +47,10 @@ export default function IconFont() {
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
svg.icon {
display: inline;
}
`}</style>
}