头像组件
支持特性
- 挂件
- 勋章
- 卡片
对接
提供两种对接方案:(推荐使用第二种,只需要在承载页加载我们的 公共节点( 前端公共配置 Node23)即可,每次不用升级直接 用到头像组件新特性)
一. 通过 npm 安装
npm install ux-feature-avatar --save
{ const avatar_config = "name": "啦啦啦" "avatar": "hasAvatar":'true' "img": '//cache.tms.beisen.cn/Image/101055/ec2102b9dc444140b78bff744420517a_l.jpeg' "color": "#f0c75a" "blessingType": 1//祝福类型 1生日 2入职 3节日 enableFeatures: true//是否开通送祝福 // simpleMode: false,//只显示头像 "medalurl": medalUrl enableJump:true//是否支持跳转个人主页 "userId": 112984691 "size": 80 decorationType: 3//挂件类型,为4文化标签,3系统勋章,2企业勋章,1祝福 // showHonorCard: false, "udc": bless: ext: type: "bless" "from": "prfile-avatar" to: userid //祝福挂件打点标记 medal: ext: type: "medal" desc: "view-wall" from: "profile-avatar" //勋章挂件打点标记 } return <div className="_avatar-wrap"> <AvatarCmp ...avatar_config /> </div > }ReactDOM
二. 通过动态标签引入
//通过动态插入标签方式加载头像组件 { const featureAvatarVersion = window__italent_common_cmps__ && window__italent_common_cmps__featureAvatar_version || '1.0.19' if !document || !windowAvatarCmp const script = document; scripttype = "text/javascript" scriptid = id if scriptreadyState script { if scriptreadyState == 'loaded' || scriptreadyState == 'completed' scriptonreadystatechange = null; callback && } else script { callback && } scriptsrc = `//stnew.beisen.com/ux/upaas/ux-feature-avatar/release/dist/main-.min.js`; documentbody else callback && } { superprops thisstate= AvatarCmp:'' } { } { const avatar_config = "name": "啦啦啦" "avatar": "hasAvatar":'true' "img": '//cache.tms.beisen.cn/Image/101055/ec2102b9dc444140b78bff744420517a_l.jpeg' "color": "#f0c75a" "blessingType": 1//祝福类型 enableFeatures: true//是否开通送祝福 // simpleMode: false,//只显示头像 "medalurl": medalUrl "userId": 112984691 "size": 80 decorationType: 3//挂件类型,为4文化标签,3系统勋章,2企业勋章,1祝福 // showHonorCard: false, "udc": bless: ext: type: "bless" "from": "prfile-avatar" to: userid //祝福挂件打点标记 medal: ext: type: "medal" desc: "view-wall" from: "profile-avatar" //勋章挂件打点标记 } const AvatarCmp =thisstate; return <div className="_avatar-wrap"> AvatarCmp&&<AvatarCmp ...avatar_config /> </div > }ReactDOM
yinjikai@beisen.com
如需协助对接可以直接联系我CHANGELOG
1.0.68
- 调用祝福㊗ ️ 时 追加参数,添加祝福类型