123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172 |
- import React, {useState } from 'react';
- import logo from './logo.svg';
- import './App.css';
- import {Provider, connect} from 'react-redux';
- import {actionSearch } from './actions';
- import store from './reducers'
- //import { CounterView, Counter, ConnectedBIGTABLO, ConnectedCounter, ConnectedBigButton } from './components'
- import {Router, Route, Link, Switch, Redirect} from 'react-router-dom';
- import createHistory from "history/createBrowserHistory";
- import {actionPosts, actionLogin} from './actions'
- const history = createHistory()
- const SearchField = connect(null, {onChange: actionSearch})(({onChange}) => {
- const [text, setText] = useState('')
- return (
- <input value={text} onChange={e => (setText(e.target.value), onChange(e.target.value))}/>
- )
- })
- const Post = ({post}) =>
- <div>
- <h2>{post.title}</h2>
- <p>{post.text}</p>
- </div>
- const PostFeed = ({posts=[]}) =>
- <div>
- {posts && posts.map(p => <Post post={p}/>)}
- </div>
- const CPostFeed = connect(s => ({posts:s.promise.posts &&
- s.promise.posts.payload &&
- s.promise.posts.payload.getPosts}))(PostFeed)
- const PageMain = () =>
- <>
- <CPostFeed />
- </>
- const LoginForm = ({onLogin}) =>
- <>
- <input type='text' />
- <input type='password' />
- <button onClick={() => onLogin('admin', '123')}>Login</button>
- </>
- const CLoginForm = connect(null, {onLogin: actionLogin})(LoginForm)
- const SearchResult = connect(s => (console.log(s), ({payload: s.searchResult &&
- s.searchResult.payload &&
- s.searchResult.payload.payload &&
- s.searchResult.payload.payload.GoodFind})))(({payload}) => <h1>{console.log(payload)}{payload && payload.map(({_id, name}) => <div>{name}</div>)}</h1>)
- store.dispatch(actionPosts())
- export default () => {
- return (
- <Provider store={store}>
- <SearchField />
- <SearchResult />
- <CLoginForm />
- <Router history={history}>
- <Route path="/" component={PageMain} />
- </Router>
- </Provider>
- )
- }
|