Package Exports

@teamix/icon
@teamix/icon/dist/TeamixIcon.css
@teamix/icon/es/index.js
@teamix/icon/es/style
@teamix/icon/es/style.js
@teamix/icon/lib/index.js
@teamix/icon/lib/style
@teamix/icon/lib/style.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@teamix/icon) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

teamix 图标组件

@teamix/icon

独立的 teamix 图标组件

API

TeamixIcon

参数名	说明	必填	类型	默认值	备注
type	图标类型	是	string
symbolPrefix	iconfont.cn 项目前缀，可从项目信息中查看	否	string	'hybridcloud-'	优先级高于 Provider、setConfig 设置的 symbolPrefix
size	图标尺寸	否	'xxs' \| 'xs' \| 'small' \| 'medium' \| 'large' \| 'xl' \| 'xxl' \| 'xxxl' \|'inherit'	'medium'
style	设置组件样式	否	React.CSSProperties
className	设置组件类名	否	string

注：

还可设置其他 html 元素属性，会透传到最外层的 DOM 结构上

TeamixIcon.setConfig

入参为一个对象

interface IOption {
  symbolPrefix?: string;
  scriptUrl: string | string [];
}

默认内置 TeamixIcon.YUNXIAO， TeamixIcon.HYBRIDCLOUD，即

// 云效
TeamixIcon.setConfig(TeamixIcon.YUNXIAO);

// 混合云
TeamixIcon.setConfig(TeamixIcon.HYBRIDCLOUD);

TeamixIcon.Provider

以组件形式通过 react context 进行全局设置：

  <TeamixIcon.Provider config={TeamixIcon.HYBRIDCLOUD}>
    <TeamixIcon type="xxx" />
  </TeamixIcon.Provider>

config 格式同上，为：

interface IOption {
  symbolPrefix?: string;
  scriptUrl: string | string [];
}

参数名	说明	必填	类型	默认值	备注
scriptUrl	iconfont.cn 项目在线生成的 symbol js 地址，为数组时需保证 symbolPrefix 一致	是	string \| string[]
symbolPrefix	iconfont.cn 项目前缀，可从项目信息中查看	否	string	'hybridcloud-'

注：

在使用该组件时，一定要调用 TeamixIcon.setConfig 或者 TeamixIcon.Provider 指定图标源信息
TeamixIcon.Provider 优先级高于 TeamixIcon.setConfig
TeamixIcon.setConfig 每次调用会增加图标源（重复的不会添加），symbolPrefix 后设置会覆盖前设置的值。如果不想被覆盖，可通过 symbolPrefix 组件属性进行设置
TeamixIcon.Provider 遵循就近原则，在组件树中最接近TeamixIcon 的嵌套优先级最高