ant-design-vue/components/icon/IconFont.jsx

53 lines
1.5 KiB
Vue
Raw Normal View History

2019-01-12 03:33:27 +00:00
import Icon from './index';
import { mergeProps } from '../_util/props-util';
2018-11-17 07:57:38 +00:00
2019-01-12 03:33:27 +00:00
const customCache = new Set();
2018-11-17 07:57:38 +00:00
2019-01-12 03:33:27 +00:00
export default function create(options) {
const { scriptUrl, extraCommonProps = {} } = options;
2018-11-17 07:57:38 +00:00
/**
* 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.
*/
2019-01-12 03:33:27 +00:00
if (
typeof document !== 'undefined' &&
typeof window !== 'undefined' &&
2018-11-17 07:57:38 +00:00
typeof document.createElement === 'function' &&
2019-01-12 03:33:27 +00:00
typeof scriptUrl === 'string' &&
scriptUrl.length &&
2018-11-17 07:57:38 +00:00
!customCache.has(scriptUrl)
) {
2019-01-12 03:33:27 +00:00
const script = document.createElement('script');
script.setAttribute('src', scriptUrl);
script.setAttribute('data-namespace', scriptUrl);
customCache.add(scriptUrl);
document.body.appendChild(script);
2018-11-17 07:57:38 +00:00
}
const Iconfont = {
functional: true,
name: 'AIconfont',
props: Icon.props,
2019-01-12 03:33:27 +00:00
render(h, context) {
const { props, slots, listeners, data } = context;
const { type, ...restProps } = props;
const slotsMap = slots();
const children = slotsMap.default;
2018-11-17 07:57:38 +00:00
// component > children > type
2019-01-12 03:33:27 +00:00
let content = null;
2018-11-17 07:57:38 +00:00
if (type) {
2019-01-12 03:33:27 +00:00
content = <use {...{ attrs: { 'xlink:href': `#${type}` } }} />;
2018-11-17 07:57:38 +00:00
}
if (children) {
2019-01-12 03:33:27 +00:00
content = children;
2018-11-17 07:57:38 +00:00
}
const iconProps = mergeProps(extraCommonProps, data, { props: restProps, on: listeners });
return <Icon {...iconProps}>{content}</Icon>;
2018-11-17 07:57:38 +00:00
},
2019-01-12 03:33:27 +00:00
};
return Iconfont;
2018-11-17 07:57:38 +00:00
}