UNPKG

dtd

Version:

根据数梦工场视觉规范打造的组件库,感谢react-components和ant design

1 lines 2.8 kB
import _extends from"babel-runtime/helpers/extends";import _defineProperty from"babel-runtime/helpers/defineProperty";import _classCallCheck from"babel-runtime/helpers/classCallCheck";import _createClass from"babel-runtime/helpers/createClass";import _possibleConstructorReturn from"babel-runtime/helpers/possibleConstructorReturn";import _inherits from"babel-runtime/helpers/inherits";var __rest=this&&this.__rest||function(e,t){var r={};for(var s in e)Object.prototype.hasOwnProperty.call(e,s)&&t.indexOf(s)<0&&(r[s]=e[s]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var a=0;for(s=Object.getOwnPropertySymbols(e);a<s.length;a++)t.indexOf(s[a])<0&&(r[s[a]]=e[s[a]])}return r};import*as React from"react";import*as ReactDOM from"react-dom";import Icon from"../icon";import classNames from"classnames";var Avatar=function(e){function t(e){_classCallCheck(this,t);var r=_possibleConstructorReturn(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return r.setScale=function(){var e=r.avatarChildren;if(e){var t=e.offsetWidth,s=ReactDOM.findDOMNode(r).getBoundingClientRect().width;s-8<t?r.setState({scale:(s-8)/t}):r.setState({scale:1})}},r.handleImgLoadError=function(){return r.setState({isImgExist:!1})},r.state={scale:1,isImgExist:!0},r}return _inherits(t,e),_createClass(t,[{key:"componentDidMount",value:function(){this.setScale()}},{key:"componentDidUpdate",value:function(e,t){(e.children!==this.props.children||t.scale!==this.state.scale&&1===this.state.scale)&&this.setScale()}},{key:"render",value:function(){var e,t,r=this,s=this.props,a=s.prefixCls,i=s.shape,n=s.size,l=s.src,o=s.icon,c=s.className,m=__rest(s,["prefixCls","shape","size","src","icon","className"]),p=classNames((_defineProperty(e={},a+"-lg","large"===n),_defineProperty(e,a+"-sm","small"===n),e)),f=classNames(a,c,p,(_defineProperty(t={},a+"-"+i,i),_defineProperty(t,a+"-image",l&&this.state.isImgExist),_defineProperty(t,a+"-icon",o),t)),h=this.props.children;if(l&&this.state.isImgExist)h=React.createElement("img",{src:l,onError:this.handleImgLoadError});else if(o)h=React.createElement(Icon,{type:o});else{var u=this.avatarChildren;if(u||1!==this.state.scale){var d={msTransform:"scale("+this.state.scale+")",WebkitTransform:"scale("+this.state.scale+")",transform:"scale("+this.state.scale+")",position:"absolute",display:"inline-block",left:"calc(50% - "+Math.round(u.offsetWidth/2)+"px)"};h=React.createElement("span",{className:a+"-string",ref:function(e){return r.avatarChildren=e},style:d},h)}else h=React.createElement("span",{className:a+"-string",ref:function(e){return r.avatarChildren=e}},h)}return React.createElement("span",_extends({},m,{className:f}),h)}}]),t}(React.Component);export default Avatar;Avatar.defaultProps={prefixCls:"dt-avatar",shape:"circle",size:"default"};