'xxx'

B/15.6.1/3/1.html

@@ -0,0 +1,47 @@
+<!--
+ * @Author: chenxuan
+ * @Date: 2021-11-22 12:52:35
+ * @LastEditTime: 2022-01-11 15:32:12
+ * @LastEditors: chenxuan
+-->
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>事件1</title>
+    <script src="../bower_components/react/react.js"></script>
+    <script src="../bower_components/react/react-dom.js"></script>
+    <script src="../bower_components/babel/browser.js"></script>
+</head>
+  <body>
+    <div id="app"></div>
+      <script type="text/babel">
+        var A=React.createClass({
+          getInitialState:function(){
+            return {
+              val:'abc'
+            }
+          },
+          changeVal:function(){
+              this.setState({
+                val:'变化后的内容'
+              })
+            },
+          render:function(){
+            var val=this.state.val;
+            return <div>
+                <li><button onClick={this.changeVal}>改变值</button></li>
+                <li>{val}</li>
+            </div>
+          }
+        })
+        ReactDOM.render(
+          <A/>
+          ,document.getElementById('app')
+        )
+      </script>
+    
+  </body>
+</html>

B/15.6.1/3/2.html

@@ -0,0 +1,56 @@
+<!--
+ * @Author: chenxuan
+ * @Date: 2021-11-22 12:52:35
+ * @LastEditTime: 2022-01-11 15:32:26
+ * @LastEditors: chenxuan
+-->
+<!DOCTYPE html>
+<html lang="en" dir="ltr">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>事件2</title>
+    <script src="../bower_components/react/react.js"></script>
+    <script src="../bower_components/react/react-dom.js"></script>
+    <script src="../bower_components/babel/browser.js"></script>
+</head>
+  <body>
+    <div id="app"></div>
+      <script type="text/babel">
+        var A1=React.createClass({
+            render:function(){
+                return <div>
+                <li>
+                    <input type="text" value={this.props.val} onChange={this.props.change}/>
+                </li> 
+                <li>{this.props.val}</li>
+            </div>
+            }
+        });
+        var B1=React.createClass({
+            getInitialState:function(){
+                return {
+                    val:'abc'
+                }
+            },
+            change:function(e){
+                this.setState({
+                    val:e.target.value
+                })
+            },
+            render:function(){
+                var val=this.state.val;
+                return <div>
+                    <A1 val={val}  change={this.change}/>
+                </div>
+            }
+        });
+        ReactDOM.render(
+          <B1/>
+          ,document.getElementById('app')
+        )
+      </script>
+    
+  </body>
+</html>