dtd
Version:
根据数梦工场视觉规范打造的组件库,感谢react-components和ant design
1 lines • 2.56 kB
JavaScript
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";import*as React from"react";import RcMention,{getMentions,Nav,toEditorState,toString}from"rc-editor-mention";import classNames from"classnames";import shallowequal from"shallowequal";import Icon from"../icon";var Mention=function(e){function t(e){_classCallCheck(this,t);var o=_possibleConstructorReturn(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return o.onSearchChange=function(e,t){return o.props.onSearchChange?o.props.onSearchChange(e,t):o.defaultSearchChange(e)},o.onChange=function(e){o.props.onChange&&o.props.onChange(e)},o.onFocus=function(e){o.setState({focus:!0}),o.props.onFocus&&o.props.onFocus(e)},o.onBlur=function(e){o.setState({focus:!1}),o.props.onBlur&&o.props.onBlur(e)},o.focus=function(e){e&&o.mentionEle._editor.focus(e)},o.mentionRef=function(e){o.mentionEle=e},o.state={suggestions:e.suggestions,focus:!1},o}return _inherits(t,e),_createClass(t,[{key:"componentWillReceiveProps",value:function(e){var t=e.suggestions;shallowequal(t,this.props.suggestions)||this.setState({suggestions:t})}},{key:"defaultSearchChange",value:function(e){var t=e.toLowerCase(),o=(this.props.suggestions||[]).filter(function(e){return e.type&&e.type===Nav?!e.props.value||-1!==e.props.value.toLowerCase().indexOf(t):-1!==e.toLowerCase().indexOf(t)});this.setState({suggestions:o})}},{key:"render",value:function(){var e,t=this.props,o=t.className,n=void 0===o?"":o,s=t.prefixCls,r=t.loading,i=t.placement,a=this.state,l=a.suggestions,p=a.focus,u=classNames(n,(_defineProperty(e={},s+"-active",p),_defineProperty(e,s+"-placement-top","top"===i),e)),c=r?React.createElement(Icon,{type:"loading"}):this.props.notFoundContent;return React.createElement(RcMention,_extends({},this.props,{className:u,ref:this.mentionRef,onSearchChange:this.onSearchChange,onChange:this.onChange,onFocus:this.onFocus,onBlur:this.onBlur,suggestions:l,notFoundContent:c}))}}]),t}(React.Component);export default Mention;Mention.getMentions=getMentions,Mention.defaultProps={prefixCls:"dt-mention",notFoundContent:"无匹配结果,轻敲空格完成输入",loading:!1,multiLines:!1,placement:"bottom"},Mention.Nav=Nav,Mention.toString=toString,Mention.toContentState=toEditorState;