support React 16.x

uxcore · Jun 9, 2018 · 9a881d4 · 9a881d4
1 parent 1a02009
commit 9a881d4
Show file tree

Hide file tree

Showing 7 changed files with 13,218 additions and 26 deletions.
diff --git a/.gitignore b/.gitignore
@@ -27,4 +27,4 @@ spm_modules
 dist
 build
 assets/**/*.css
-coverage
+coveragepackage-lock.json
diff --git a/demo/CollapseDemo.js b/demo/CollapseDemo.js
@@ -18,19 +18,24 @@ export default class Demo extends Component {
 
   constructor(props) {
     super(props);
+
+    this.handleChange = this.handleChange.bind(this);
     this.state = {
+      activeKey: '1',
     };
   }
 
   handleChange(key, activeKey) {
     console.log(key, activeKey);
+    this.setState({ activeKey });
   }
 
   render() {
+    const { activeKey } = this.state;
     return (
       <div style={{ padding: '20px' }}>
         <h2>可以同时展开多个面板，这个例子默认展开了第一个。</h2>
-        <Collapse defaultActiveKey={['1']} onChange={this.handleChange}>
+        <Collapse activeKey={activeKey} onChange={this.handleChange}>
           <Panel header={'This is panel header 1'} key="1">
             <p>{text}</p>
           </Panel>
@@ -42,7 +47,7 @@ export default class Demo extends Component {
           </Panel>
         </Collapse>
         <h2>手风琴，每次只打开一个tab。默认打开第一个。</h2>
-        <Collapse accordion onChange={this.handleChange}>
+        <Collapse accordion>
           <Panel header={'This is panel header 1'} key="1">
             <p>{text}</p>
           </Panel>
@@ -54,7 +59,7 @@ export default class Demo extends Component {
           </Panel>
         </Collapse>
         <h2>手风琴嵌套折叠面板</h2>
-        <Collapse onChange={this.handleChange} accordion>
+        <Collapse accordion>
           <Panel header={'This is panel header 1'} key="1">
             <Collapse defaultActiveKey="1">
               <Panel header={'This is panel nest panel'} key="1">

diff --git a/index.html b/index.html
@@ -9,10 +9,9 @@
 <body>
     <div id="UXCoreDemo"></div>
     <script src="./node_modules/console-polyfill/index.js"></script>
-    <script src="./node_modules/es5-shim/es5-shim.min.js"></script>
-    <script src="./node_modules/es5-shim/es5-sham.min.js"></script>
-    <script src="./node_modules/react/dist/react-with-addons.js"></script>
-    <script src="./node_modules/react-dom/dist/react-dom.js"></script>
+    <script src="./node_modules/babel-polyfill/dist/polyfill.min.js"></script>
+        <script src="./node_modules/react/umd/react.development.js"></script>
+    <script src="./node_modules/react-dom/umd/react-dom.development.js"></script>
     <script src="./dist/demo.js"></script>
 </body>
 </html>