feat(Timeline): update lifecycle

docs/timeline/demo/fold.md

@@ -64,4 +64,4 @@ ReactDOM.render(<Demo />, mountNode);
     margin-bottom: 20px;
 }
 
-````
+````

src/timeline/view/timeline.jsx

@@ -1,6 +1,8 @@
 import React, { Component, Children } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
+import { polyfill } from 'react-lifecycles-compat';
+
 import { obj } from '../../util';
 import ConfigProvider from '../../config-provider';
 import nextLocale from '../../locale/zh-cn';
@@ -43,12 +45,17 @@ class Timeline extends Component {
         };
     }
 
-    componentWillReceiveProps(nextProps) {
-        if ('fold' in nextProps) {
-            this.setState({
+    static getDerivedStateFromProps(nextProps, prevState) {
+        if (
+            'fold' in nextProps &&
+            'fold' in prevState &&
+            nextProps.fold.length !== prevState.fold.length
+        ) {
+            return {
                 fold: nextProps.fold,
-            });
+            };
         }
+        return null;
     }
 
     toggleFold(folderIndex, total) {
@@ -138,4 +145,4 @@ class Timeline extends Component {
     }
 }
 
-export default ConfigProvider.config(Timeline);
+export default ConfigProvider.config(polyfill(Timeline));

test/timeline/index-spec.js

@@ -10,7 +10,7 @@ Enzyme.configure({ adapter: new Adapter() });
 const Item = Timeline.Item;
 
 /* eslint-disable */
-describe('Button', () => {
+describe('Timeline', () => {
     describe('render', () => {
         it('should render a timeline', () => {
             const wrapper = mount(