xxx

exercise/src/App.js

@@ -11,20 +11,27 @@ class App extends React.Component{
           {"title":"性别:","name":"男士"},
           {"title":"年龄:","name":"18岁"},
           {"title":"学历:","name":"本科"},
-        ]
+        ],
+        childValue:"父组件原始值"
       }
     }
+    updateValue=(val)=>{
+      this.setState({childValue:val})
+    }
     render(){
       return (
         <div className="App">
           <div className="left">
-            <Nav goods={this.state.goods}></Nav>
+            <Nav goods={this.state.goods} getParent={this.updateValue}></Nav>
           </div>
           <div className="right">
             <img src={logo} className="App-logo" alt="logo" />
             <p>
               Edit <code>src/App.js</code> and save to reload.
             </p>
+            <p>
+              {this.state.childValue}
+            </p>
             <a
               className="App-link"
               href="https://reactjs.org"

exercise/src/components/button/index.js

@@ -0,0 +1 @@
+import React ,{component} from 'react'

exercise/src/components/nav/index.js

@@ -3,10 +3,11 @@ class Nav extends Component{
     render(){
         return (
             <div className="nav">
-                <h3>1、父组件向组件传值</h3>
-                <h3>2、遍历</h3>
-                <h3>3、子组件向父组件传值</h3>
-                <ul>
+                <h3>1、父组件向子组件传值</h3>
+                <h3>2、子组件向父组件传值</h3>
+                <h3>3、遍历</h3>
+                <h3>4、插槽</h3>
+                <div>
                     {
                         this.props.goods.map((item,index)=>{
                             return(
@@ -17,7 +18,8 @@ class Nav extends Component{
                             )
                         })
                     }
-                </ul>
+                    <button type="button" onClick={this.props.getParent.bind(this,'子组件传过去的值')}>点击向父组件传值</button>
+                </div>
             </div>
         )
     }