mirror of
https://github.com/microsoft/frontend-bootcamp.git
synced 2026-01-26 14:56:42 +08:00
adding exercise for step 7
This commit is contained in:
37
step2-07/exercise/src/components/TodoList.tsx
Normal file
37
step2-07/exercise/src/components/TodoList.tsx
Normal file
@@ -0,0 +1,37 @@
|
||||
import React from 'react';
|
||||
import { Stack } from 'office-ui-fabric-react';
|
||||
import { TodoListItem } from './TodoListItem';
|
||||
import { Store } from '../store';
|
||||
import { connect } from 'react-redux';
|
||||
|
||||
interface TodoListProps {
|
||||
todos: Store['todos'];
|
||||
}
|
||||
|
||||
const TodoList = (props: TodoListProps) => {
|
||||
const { todos } = props;
|
||||
const filteredTodos = Object.keys(todos);
|
||||
|
||||
return (
|
||||
<Stack gap={10}>
|
||||
{filteredTodos.map(id => (
|
||||
<TodoListItem key={id} id={id} />
|
||||
))}
|
||||
</Stack>
|
||||
);
|
||||
};
|
||||
|
||||
function mapStateToProps(state: Store) {
|
||||
return { ...state };
|
||||
}
|
||||
|
||||
function mapDispatchToProps(dispatch: any) {
|
||||
return {};
|
||||
}
|
||||
|
||||
const component = connect(
|
||||
mapStateToProps,
|
||||
mapDispatchToProps
|
||||
)(TodoList);
|
||||
|
||||
export { component as TodoList };
|
||||
Reference in New Issue
Block a user