9-1详情页面的布局

9-2使用redux管理详情页面数据

componentDidMount(){

this.props.getDetail();}

const mapDispatch=)dispatch)=>{

getDetail(){

dispatch(

9-5-登录页面布局

import axios from 'axios';
import * as constants from './constants';


const changeLogin = () => ({
    type: constants.CHANGE_LOGIN,
    value: true
})


export const logout = () => ({
    type: constants.LOGOUT,
    value: false
})


export const login = (accout, password) => {
    return (dispatch) => {
        axios.get('/api/login.json?account=' + accout + '&password=' + password).then((res) => {
            const result = res.data.data;
            if (result) {
                dispatch(changeLogin())
            }else {
                alert('登陆失败')
            }
        })
    }
}

9-7登陆鉴权以及代码优化

9-8异步组件以及withRouter路由方法的使用

react-loadable

yarn add react-loadable

（withRouter(Detail));让detail有能力获取其中的所有的参数和内容

10-1项目上线流程

XAMPP

npm run build

10-3总结