[TOC] ### 1. 创建子组件 ~~~ import React from 'react'; // import example from '../models/example' const Example = (props) => { return ( <div> //接收的父组件传递过来的参数 <div>{props.count}</div> //事件处理：将事件通过dispatch传递给reducers（models下的文件中）进行事件处理 <button onClick={() => { props.dispatch({type: 'example/add'}); }}>添加</button> </div> ); }; Example.propTypes = { }; export default Example; ~~~ ### 2. 父组件使用子组件并传参 ~~~ import React from 'react'; import { connect } from 'dva'; import styles from './IndexPage.css'; import { Link } from 'react-router-dom'; import Example from '../components/Example' //给页面传递两个参数，一个是dispatch，还有一个是要传过去的变量，通过下面的connect连接组件中要传的值 function IndexPage({dispatch,count}) { //定义私有属性方便一起传递 let _props = { count, dispatch } return ( <div className={styles.normal}> <Link to={'/detail/'}>跳转</Link> {/* 父组件向子组件传参 */} <Example {..._props}></Example> </div> ); } // IndexPage.propTypes = { // }; //用于连接模板文件与models文件 export default connect(({example})=>{ return{ count: example.count } })(IndexPage); ~~~