[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); ~~~