Commit 5cce0441 authored by afc163's avatar afc163

Debounce not working

parent 486ec4fa
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import G2 from 'g2'; import G2 from 'g2';
import Debounce from 'lodash-decorators/debounce'; import Debounce from 'lodash-decorators/debounce';
import Bind from 'lodash-decorators/bind';
import equal from '../equal'; import equal from '../equal';
import styles from '../index.less'; import styles from '../index.less';
...@@ -26,10 +27,12 @@ class Bar extends PureComponent { ...@@ -26,10 +27,12 @@ class Bar extends PureComponent {
if (this.chart) { if (this.chart) {
this.chart.destroy(); this.chart.destroy();
} }
this.resize.cancel();
} }
@Bind()
@Debounce(200) @Debounce(200)
resize = () => { resize() {
if (!this.node) { if (!this.node) {
return; return;
} }
......
...@@ -4,6 +4,7 @@ import { Divider } from 'antd'; ...@@ -4,6 +4,7 @@ import { Divider } from 'antd';
import classNames from 'classnames'; import classNames from 'classnames';
import ReactFitText from 'react-fittext'; import ReactFitText from 'react-fittext';
import Debounce from 'lodash-decorators/debounce'; import Debounce from 'lodash-decorators/debounce';
import Bind from 'lodash-decorators/bind';
import equal from '../equal'; import equal from '../equal';
import styles from './index.less'; import styles from './index.less';
...@@ -31,10 +32,12 @@ class Pie extends Component { ...@@ -31,10 +32,12 @@ class Pie extends Component {
if (this.chart) { if (this.chart) {
this.chart.destroy(); this.chart.destroy();
} }
this.resize.cancel();
} }
@Debounce(200) @Bind()
resize = () => { @Debounce(300)
resize() {
const { hasLegend } = this.props; const { hasLegend } = this.props;
if (!hasLegend || !this.root) { if (!hasLegend || !this.root) {
window.removeEventListener('resize', this.resize); window.removeEventListener('resize', this.resize);
......
...@@ -3,6 +3,7 @@ import classNames from 'classnames'; ...@@ -3,6 +3,7 @@ import classNames from 'classnames';
import G2 from 'g2'; import G2 from 'g2';
import Cloud from 'g-cloud'; import Cloud from 'g-cloud';
import Debounce from 'lodash-decorators/debounce'; import Debounce from 'lodash-decorators/debounce';
import Bind from 'lodash-decorators/bind';
import styles from './index.less'; import styles from './index.less';
/* eslint no-underscore-dangle: 0 */ /* eslint no-underscore-dangle: 0 */
...@@ -26,6 +27,7 @@ class TagCloud extends PureComponent { ...@@ -26,6 +27,7 @@ class TagCloud extends PureComponent {
componentWillUnmount() { componentWillUnmount() {
window.removeEventListener('resize', this.resize); window.removeEventListener('resize', this.resize);
this.resize.cancel();
} }
resize = () => { resize = () => {
...@@ -73,6 +75,7 @@ class TagCloud extends PureComponent { ...@@ -73,6 +75,7 @@ class TagCloud extends PureComponent {
this.node = node; this.node = node;
} }
@Bind()
@Debounce(500) @Debounce(500)
renderChart = (newData) => { renderChart = (newData) => {
const data = newData || this.props.data; const data = newData || this.props.data;
......
...@@ -8,6 +8,7 @@ import moment from 'moment'; ...@@ -8,6 +8,7 @@ import moment from 'moment';
import groupBy from 'lodash/groupBy'; import groupBy from 'lodash/groupBy';
import { ContainerQuery } from 'react-container-query'; import { ContainerQuery } from 'react-container-query';
import classNames from 'classnames'; import classNames from 'classnames';
import Debounce from 'lodash-decorators/debounce';
import HeaderSearch from '../components/HeaderSearch'; import HeaderSearch from '../components/HeaderSearch';
import NoticeIcon from '../components/NoticeIcon'; import NoticeIcon from '../components/NoticeIcon';
import GlobalFooter from '../components/GlobalFooter'; import GlobalFooter from '../components/GlobalFooter';
...@@ -69,7 +70,7 @@ class BasicLayout extends React.PureComponent { ...@@ -69,7 +70,7 @@ class BasicLayout extends React.PureComponent {
}); });
} }
componentWillUnmount() { componentWillUnmount() {
clearTimeout(this.resizeTimeout); this.triggerResizeEvent.cancel();
} }
onCollapse = (collapsed) => { onCollapse = (collapsed) => {
this.props.dispatch({ this.props.dispatch({
...@@ -216,11 +217,13 @@ class BasicLayout extends React.PureComponent { ...@@ -216,11 +217,13 @@ class BasicLayout extends React.PureComponent {
type: 'global/changeLayoutCollapsed', type: 'global/changeLayoutCollapsed',
payload: !collapsed, payload: !collapsed,
}); });
this.resizeTimeout = setTimeout(() => { this.triggerResizeEvent();
const event = document.createEvent('HTMLEvents'); }
event.initEvent('resize', true, false); @Debounce(600)
window.dispatchEvent(event); triggerResizeEvent() { // eslint-disable-line
}, 600); const event = document.createEvent('HTMLEvents');
event.initEvent('resize', true, false);
window.dispatchEvent(event);
} }
handleNoticeClear = (type) => { handleNoticeClear = (type) => {
message.success(`ζΈ…η©ΊδΊ†${type}`); message.success(`ζΈ…η©ΊδΊ†${type}`);
......
import React, { Component } from 'react'; import React, { Component } from 'react';
import Debounce from 'lodash-decorators/debounce'; import Debounce from 'lodash-decorators/debounce';
import Bind from 'lodash-decorators/bind';
import { connect } from 'dva'; import { connect } from 'dva';
import { Button, Menu, Dropdown, Icon, Row, Col, Steps, Card, Popover, Badge, Table, Tooltip, Divider } from 'antd'; import { Button, Menu, Dropdown, Icon, Row, Col, Steps, Card, Popover, Badge, Table, Tooltip, Divider } from 'antd';
import classNames from 'classnames'; import classNames from 'classnames';
...@@ -160,14 +161,16 @@ export default class AdvancedProfile extends Component { ...@@ -160,14 +161,16 @@ export default class AdvancedProfile extends Component {
componentWillUnmount() { componentWillUnmount() {
window.removeEventListener('resize', this.setStepDirection); window.removeEventListener('resize', this.setStepDirection);
this.setStepDirection.cancel();
} }
onOperationTabChange = (key) => { onOperationTabChange = (key) => {
this.setState({ operationkey: key }); this.setState({ operationkey: key });
} }
@Bind()
@Debounce(200) @Debounce(200)
setStepDirection = () => { setStepDirection() {
const { stepDirection } = this.state; const { stepDirection } = this.state;
const w = getWindowWidth(); const w = getWindowWidth();
if (stepDirection !== 'vertical' && w <= 576) { if (stepDirection !== 'vertical' && w <= 576) {
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment