diff --git a/components/spin/demo/nested.md b/components/spin/demo/nested.md
index a799fa8e4..fbf973944 100644
--- a/components/spin/demo/nested.md
+++ b/components/spin/demo/nested.md
@@ -27,7 +27,7 @@ const Card = React.createClass({
);
return (
- {container}
+ {container}
切换加载状态:
);
diff --git a/components/spin/index.jsx b/components/spin/index.jsx
index 2b5c6ac81..846f51320 100644
--- a/components/spin/index.jsx
+++ b/components/spin/index.jsx
@@ -10,6 +10,13 @@ export default class Spin extends React.Component {
spinning: true,
}
+ constructor(props) {
+ super(props);
+ const spinning = this.getSpinning(props);
+ this.state = {
+ spinning,
+ };
+ }
static propTypes = {
className: React.PropTypes.string,
size: React.PropTypes.oneOf(['small', 'default', 'large']),
@@ -26,10 +33,29 @@ export default class Spin extends React.Component {
findDOMNode(this).className += ` ${this.props.prefixCls}-show-text`;
}
}
-
+ getSpinning(props) {
+ warning(!('spining' in this.props), '`spining` property of Popover is a spell mistake, use `spinning` instead.');
+ const { spinning, spining } = props;
+ // Backwards support
+ if (spining !== undefined) {
+ return spining;
+ }
+ return spinning;
+ }
+ componentWillReceiveProps(nextProps) {
+ const spinning = this.getSpinning(nextProps);
+ if (this.debounceTimeout) {
+ clearTimeout(this.debounceTimeout);
+ }
+ if (spinning) {
+ this.debounceTimeout = setTimeout(() => this.setState({ spinning }), 500);
+ } else {
+ this.setState({ spinning });
+ }
+ }
render() {
- const { className, size, prefixCls, tip, spining = true } = this.props;
- const spinning = this.props.spinning && spining; // Backwards support
+ const { className, size, prefixCls, tip } = this.props;
+ const { spinning } = this.state;
const spinClassName = classNames({
[prefixCls]: true,