54 lines
1.4 KiB
Vue
54 lines
1.4 KiB
Vue
|
import Icon from './index'
|
||
|
|
|
||
|
|
const customCache = new Set()
|
||
|
|
|
||
|
|
export default function create (options) {
|
||
|
|
const { scriptUrl } = options
|
||
|
|
|
||
|
|
/**
|
||
|
|
* DOM API required.
|
||
|
|
* Make sure in browser environment.
|
||
|
|
* The Custom Icon will create a <script/>
|
||
|
|
* that loads SVG symbols and insert the SVG Element into the document body.
|
||
|
|
*/
|
||
|
|
if (typeof document !== 'undefined' && typeof window !== 'undefined' &&
|
||
|
|
typeof document.createElement === 'function' &&
|
||
|
|
typeof scriptUrl === 'string' && scriptUrl.length &&
|
||
|
|
!customCache.has(scriptUrl)
|
||
|
|
) {
|
||
|
|
const script = document.createElement('script')
|
||
|
|
script.setAttribute('src', scriptUrl)
|
||
|
|
script.setAttribute('data-namespace', scriptUrl)
|
||
|
|
customCache.add(scriptUrl)
|
||
|
|
document.body.appendChild(script)
|
||
|
|
}
|
||
|
|
|
||
|
|
const Iconfont = {
|
||
|
|
functional: true,
|
||
|
|
name: 'AIconfont',
|
||
|
|
render (h, context) {
|
||
|
|
const { props, slots, listeners } = context
|
||
|
|
const { type, ...restProps } = props
|
||
|
|
const slotsMap = slots()
|
||
|
|
const children = slotsMap.default
|
||
|
|
// component > children > type
|
||
|
|
let content = null
|
||
|
|
if (type) {
|
||
|
|
content = <use {...{ attrs: { 'xlink:href': `#${type}` }}} />
|
||
|
|
}
|
||
|
|
if (children) {
|
||
|
|
content = children
|
||
|
|
}
|
||
|
|
return (
|
||
|
|
<Icon
|
||
|
|
{...{ props: restProps, on: listeners }}
|
||
|
|
>
|
||
|
|
{content}
|
||
|
|
</Icon>
|
||
|
|
|
||
|
|
)
|
||
|
|
},
|
||
|
|
}
|
||
|
|
return Iconfont
|
||
|
|
}
|