diff --git a/src/components/Ellipsis/index.js b/src/components/Ellipsis/index.js
index ae4019ce7ee6971382cd71b7b9a87e24d3a384eb..9e99c416000eabe6b24364a194df149043a3a7ea 100644
--- a/src/components/Ellipsis/index.js
+++ b/src/components/Ellipsis/index.js
@@ -6,7 +6,7 @@ import styles from './index.less';
/* eslint react/no-did-mount-set-state: 0 */
/* eslint no-param-reassign: 0 */
-const isSupportLineClamp = (document.body.style.webkitLineClamp !== undefined);
+const isSupportLineClamp = document.body.style.webkitLineClamp !== undefined;
const EllipsisText = ({ text, length, tooltip, ...other }) => {
if (typeof text !== 'string') {
@@ -20,16 +20,24 @@ const EllipsisText = ({ text, length, tooltip, ...other }) => {
if (length - tail.length <= 0) {
displayText = '';
} else {
- displayText = text.slice(0, (length - tail.length));
+ displayText = text.slice(0, length - tail.length);
}
if (tooltip) {
- return {displayText}{tail};
+ return (
+
+
+ {displayText}
+ {tail}
+
+
+ );
}
return (
- {displayText}{tail}
+ {displayText}
+ {tail}
);
};
@@ -38,7 +46,7 @@ export default class Ellipsis extends Component {
state = {
text: '',
targetCount: 0,
- }
+ };
componentDidMount() {
if (this.node) {
@@ -81,7 +89,7 @@ export default class Ellipsis extends Component {
targetCount: count,
});
}
- }
+ };
bisection = (th, m, b, e, text, shadowNode) => {
const suffix = '...';
@@ -115,94 +123,88 @@ export default class Ellipsis extends Component {
return this.bisection(th, mid, begin, end, text, shadowNode);
}
}
- }
+ };
handleRoot = (n) => {
this.root = n;
- }
+ };
handleContent = (n) => {
this.content = n;
- }
+ };
handleNode = (n) => {
this.node = n;
- }
+ };
handleShadow = (n) => {
this.shadow = n;
- }
+ };
handleShadowChildren = (n) => {
this.shadowChildren = n;
- }
+ };
render() {
const { text, targetCount } = this.state;
- const {
- children,
- lines,
- length,
- className,
- tooltip,
- ...restProps
- } = this.props;
+ const { children, lines, length, className, tooltip, ...restProps } = this.props;
const cls = classNames(styles.ellipsis, className, {
- [styles.lines]: (lines && !isSupportLineClamp),
- [styles.lineClamp]: (lines && isSupportLineClamp),
+ [styles.lines]: lines && !isSupportLineClamp,
+ [styles.lineClamp]: lines && isSupportLineClamp,
});
if (!lines && !length) {
- return ({children});
+ return (
+
+ {children}
+
+ );
}
// length
if (!lines) {
- return ();
+ return (
+
+ );
}
const id = `antd-pro-ellipsis-${`${new Date().getTime()}${Math.floor(Math.random() * 100)}`}`;
// support document.body.style.webkitLineClamp
if (isSupportLineClamp) {
- const style = `#${id}{-webkit-line-clamp:${lines};}`;
+ const style = `#${id}{-webkit-line-clamp:${lines};-webkit-box-orient: vertical;}`;
return (
- {
- tooltip ? ({children}) : children
- }
-
);
+ {tooltip ? {children} : children}
+
+ );
}
const childNode = (
- {
- (targetCount > 0) && text.substring(0, targetCount)
- }
- {
- (targetCount > 0) && (targetCount < text.length) && '...'
- }
+ {targetCount > 0 && text.substring(0, targetCount)}
+ {targetCount > 0 && targetCount < text.length && '...'}
);
return (
-
-
- {
- tooltip ? (
-
{childNode}
- ) : childNode
- }
-
{children}
-
{text}
+
+
+ {tooltip ?
{childNode} : childNode}
+
+ {children}
+
+
+ {text}
+
);
diff --git a/src/components/Ellipsis/index.less b/src/components/Ellipsis/index.less
index acd837899ecfd6dcd054a5852dfc495682604f78..dd59e3fac942fd299055f0591e87215742213f04 100644
--- a/src/components/Ellipsis/index.less
+++ b/src/components/Ellipsis/index.less
@@ -21,5 +21,4 @@
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
- -webkit-box-orient: vertical;
}