Merge pull request #1835 from ddcat1115/fix-1777

fix #1777 add onChange for Affix
This commit is contained in:
RaoHai 2016-05-26 16:17:33 +08:00
commit a940547aff
3 changed files with 29 additions and 4 deletions

View File

@ -0,0 +1,21 @@
---
order: 3
title: 固定状态改变的回调
---
可以获得是否固定的状态。
````jsx
import { Affix, Button } from 'antd';
const onChange = function (affixed) {
console.log(affixed); // true or false
};
ReactDOM.render(
<Affix offsetTop={120} onChange={onChange}>
<Button>固定在距离顶部 120px 的位置</Button>
</Affix>
, mountNode);
````

View File

@ -39,6 +39,10 @@ export default class Affix extends React.Component {
offsetBottom: React.PropTypes.number,
}
static defaultProps = {
onChange() {},
}
constructor(props) {
super(props);
this.state = {
@ -51,7 +55,6 @@ export default class Affix extends React.Component {
// Backwards support
offsetTop = offsetTop || offset;
const scrollTop = getScroll(window, true);
const elemOffset = getOffset(ReactDOM.findDOMNode(this));
const elemSize = {
@ -78,7 +81,7 @@ export default class Affix extends React.Component {
left: elemOffset.left,
width: ReactDOM.findDOMNode(this).offsetWidth,
},
});
}, () => this.props.onChange(!!this.state.affixStyle));
}
} else if (scrollTop < elemOffset.top + elemSize.height + offsetBottom - window.innerHeight &&
offsetMode.bottom) {
@ -91,12 +94,12 @@ export default class Affix extends React.Component {
left: elemOffset.left,
width: ReactDOM.findDOMNode(this).offsetWidth,
},
});
}, () => this.props.onChange(!!this.state.affixStyle));
}
} else if (this.state.affixStyle) {
this.setState({
affixStyle: null,
});
}, () => this.props.onChange(!!this.state.affixStyle));
}
}

View File

@ -20,3 +20,4 @@ english: Affix
|-------------|----------------|--------------------|--------------|
| offsetTop | 距离窗口顶部达到指定偏移量后触发 | Number | |
| offsetBottom | 距离窗口底部达到指定偏移量后触发 | Number | |
| onChange | 固定状态改变时触发的回调函数 | Function | 无 |