mirror of
https://github.com/rjNemo/react_template
synced 2026-06-06 07:26:40 +00:00
set store layout
This commit is contained in:
parent
55698db937
commit
33cb46b4ff
8 changed files with 30 additions and 18 deletions
|
|
@ -1,13 +1,12 @@
|
|||
import React, { FC } from 'react';
|
||||
|
||||
import Router from './Router';
|
||||
import { Header } from './components/Header';
|
||||
import { Layout } from './components/layout';
|
||||
|
||||
const App: FC = () => (
|
||||
<>
|
||||
<Header />
|
||||
<Layout>
|
||||
<Router />
|
||||
</>
|
||||
</Layout>
|
||||
);
|
||||
|
||||
export default App;
|
||||
|
|
|
|||
11
src/components/layout.tsx
Normal file
11
src/components/layout.tsx
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
import React from 'react';
|
||||
import { FC } from 'react';
|
||||
|
||||
import { Header } from './Header';
|
||||
|
||||
export const Layout: FC = ({ children }) => (
|
||||
<div>
|
||||
<Header />
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
|
|
@ -1,11 +1,12 @@
|
|||
import React, { FC } from 'react';
|
||||
import React, { FC, memo } from 'react';
|
||||
|
||||
import Todo from '../../core/models/todo';
|
||||
|
||||
interface Props {
|
||||
todos: Todo[];
|
||||
}
|
||||
|
||||
export const TodoList: FC<Props> = ({ todos }) => (
|
||||
const TodoList: FC<Props> = ({ todos }) => (
|
||||
<div>
|
||||
<ul>
|
||||
{todos.map((todo) => (
|
||||
|
|
@ -16,3 +17,5 @@ export const TodoList: FC<Props> = ({ todos }) => (
|
|||
</ul>
|
||||
</div>
|
||||
);
|
||||
|
||||
export default memo(TodoList);
|
||||
|
|
|
|||
|
|
@ -1,28 +1,26 @@
|
|||
import React, { FC } from 'react';
|
||||
|
||||
import { TodoList } from './TodoList';
|
||||
import TodoList from './TodoList';
|
||||
import { Button } from '../../components/button';
|
||||
import { Container } from '../../components/container';
|
||||
|
||||
import Todo from '../../core/models/todo';
|
||||
import { listTodos } from '../../core/services/todo';
|
||||
import { Container } from '../../components/container';
|
||||
|
||||
export const Home: FC = () => {
|
||||
const todos: Todo[] = listTodos();
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Container>
|
||||
<h1>Your tasks</h1>
|
||||
<p>Hi there!</p>
|
||||
<TodoList todos={todos} />
|
||||
<Container>
|
||||
<Button primary onClick={() => console.log('Clicked Normal Button')}>
|
||||
Normal Button
|
||||
</Button>
|
||||
<Button primary onClick={() => console.log('Clicked Primary Button')}>
|
||||
Primary Button
|
||||
</Button>
|
||||
</Container>
|
||||
</div>
|
||||
<Button primary onClick={() => console.log('Clicked Normal Button')}>
|
||||
Normal Button
|
||||
</Button>
|
||||
<Button primary onClick={() => console.log('Clicked Primary Button')}>
|
||||
Primary Button
|
||||
</Button>
|
||||
</Container>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
1
src/core/store/index.ts
Normal file
1
src/core/store/index.ts
Normal file
|
|
@ -0,0 +1 @@
|
|||
// init redux here
|
||||
0
src/core/store/todo/actions.ts
Normal file
0
src/core/store/todo/actions.ts
Normal file
0
src/core/store/todo/reducers.ts
Normal file
0
src/core/store/todo/reducers.ts
Normal file
0
src/core/store/todo/selectors.ts
Normal file
0
src/core/store/todo/selectors.ts
Normal file
Loading…
Reference in a new issue