Not show spining mask in ie <= 10 (#14511)

* not show spining mask in ie <= 10
fix #14365

* revert, let's use css check for this

* add styleChecker

* add pointer-events check

* delay check spin not support when did mount

* use css hack replace style check
This commit is contained in:
zombieJ 2019-01-26 11:55:53 +08:00 committed by GitHub
parent f5cbf0f9f1
commit bfec344de5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 17 additions and 15 deletions

View File

@ -1,12 +0,0 @@
export default function isFlexSupported() {
if (typeof window !== 'undefined' && window.document && window.document.documentElement) {
const { documentElement } = window.document;
return (
'flex' in documentElement.style ||
'webkitFlex' in documentElement.style ||
'Flex' in documentElement.style ||
'msFlex' in documentElement.style
);
}
return false;
}

View File

@ -0,0 +1,13 @@
function isStyleSupport(styleName: string | Array<string>): boolean {
if (typeof window !== 'undefined' && window.document && window.document.documentElement) {
const styleNameList = Array.isArray(styleName) ? styleName : [styleName];
const { documentElement } = window.document;
return styleNameList.some(name => name in documentElement.style);
}
return false;
}
export const isFlexSupported = isStyleSupport(['flex', 'webkitFlex', 'Flex', 'msFlex']);
export default isStyleSupport;

View File

@ -118,7 +118,7 @@ class Spin extends React.Component<SpinProps, SpinState> {
if (delay) {
this.updateSpinning = debounce(this.originalUpdateSpinning, delay);
}
}
};
updateSpinning = () => {
const { spinning } = this.props;

View File

@ -90,6 +90,7 @@
height: 100%;
width: 100%;
z-index: 10;
display: ~'none \9\0';
}
}

View File

@ -7,7 +7,7 @@ import classNames from 'classnames';
import Icon from '../icon';
import { ConfigConsumer, ConfigConsumerProps } from '../config-provider';
import warning from '../_util/warning';
import isFlexSupported from '../_util/isFlexSupported';
import { isFlexSupported } from '../_util/styleChecker';
export type TabsType = 'line' | 'card' | 'editable-card';
export type TabsPosition = 'top' | 'right' | 'bottom' | 'left';
@ -83,7 +83,7 @@ export default class Tabs extends React.Component<TabsProps, any> {
componentDidMount() {
const NO_FLEX = ' no-flex';
const tabNode = ReactDOM.findDOMNode(this) as Element;
if (tabNode && !isFlexSupported() && tabNode.className.indexOf(NO_FLEX) === -1) {
if (tabNode && !isFlexSupported && tabNode.className.indexOf(NO_FLEX) === -1) {
tabNode.className += NO_FLEX;
}
}