<?php
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/
//Route::get('/home', 'HomeController@index')->name('home');
Route::group( [ 'middleware' => [ 'web' ] ], function () {
Route::get( '/', function () {
return view('index');
});
Route::group( [ 'prefix' => 'user', 'middleware' => [ 'auth' ] ], function () {
Auth::routes();
//Route::get( '/home', 'HomeController@index' )->name( 'home' );
});
});
let unsubscribe = store.subscribe( () => console.log( store.getState() ) );import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/app';
ReactDOM.render( <App />, document.getElementById("app") );import React from 'react';
import { combineReducers, createStore } from 'redux';
import { Provider } from 'react-redux';
import { BrowserRouter, Route, Switch, Link } from 'react-router-dom';
import Header from './header';
import Footer from './footer';
import Home from './home';
import About from './about';
import NotFound from './not-found';
import EDElements from './e-d-elements';
import ActionsReducers from './actions-reducers';
import menReducers from './../reducers/men';
import animalsReducers from './../reducers/animals';
let store = createStore( combineReducers( { menReducers, animalsReducers } ) );
let unsubscribe = store.subscribe( () => console.log( store.getState() ) );
export default (props) => (
<div>
<Provider store={store}>
<BrowserRouter>
<div>
<Header/>
<div className="content">
<div className='pure-g'>
<div className="pure-u-1-5">
<nav>
<ul>
<li><Link to="/e-d-elements">Включение и выключение элементов</Link></li>
<li><Link to="/actions-reducers">События и редьюсеры</Link></li>
</ul>
</nav>
</div>
<div className="pure-u-4-5">
<Switch>
<Route exact path='/' component={ Home } />
<Route path='/about' component={ About } />
<Route path='/e-d-elements' component={ EDElements } />
<Route path='/actions-reducers' component={ ActionsReducers } />
<Route component={ NotFound } />
</Switch>
</div>
</div>
</div>
<Footer/>
</div>
</BrowserRouter>
</Provider>
</div>
);export const ADD_MAN = 'ADD_MAN';
export const add = ( man ) => {
return { type: ADD_MAN, payload: man }
}import { combineReducers } from 'redux';
import { ADD_MAN } from "../actions/men";
const initialState = {
men: []
};
function menApp( state = initialState, action ) {
switch ( action.type ) {
case ADD_MAN:
let newState = Object.assign( {}, { men: [ ...state.men, action.payload ] } );
console.log( 'New state in reducers/men.js -> menApp()' );
console.log( newState );
return newState;
default:
return state;
}
};
const menReducers = combineReducers( { menApp } );
export default menReducers;import React from 'react';
import { connect } from 'react-redux';
import { add as addMan } from './../actions/men';
class ActionsReducers extends React.Component {
// componentWillMount() {
//
// console.log( 'ActionsReducers.componentWillMount' );
//
// this.props.addMan( { name: 'Альберт', family: 'Эйнштейн' } );
//
// }
//
// shouldComponentUpdate( nextProps, nextState ) {
//
// console.log( 'ActionsReducers.shouldComponentUpdate' );
//
// console.log( nextProps, nextState );
//
// }
//
// componentWillReceiveProps( nextProps ) {
//
// console.log( 'ActionsReducers.componentWillReceiveProps' );
//
// console.log( nextProps );
//
// }
moreMen() {
console.log( 'ActionsReducers.moreMen' );
this.props.addMan( { name: 'Томас', family: 'Эдисон' } );
}
render() {
console.log( 'ActionsReducers.render' );
// console.log( this.props.men );
return (
<div>
<main>
<h1>Действия и редьюсеры</h1>
<div>
<div className='pure-g'>
<div className="pure-u-1-2">
<h2>Люди</h2>
<button onClick={() => this.moreMen()}>Еще</button>
</div>
<div className="pure-u-1-2">
<h2>Животные</h2>
</div>
</div>
</div>
</main>
</div>
);
}
}
function mapStateToProps( store ) {
return {
men: store.men
}
}
const mapDispatchToProps = {
addMan
};
export default connect( mapStateToProps, mapDispatchToProps )( ActionsReducers );