回答編集履歴

1

型定義について追記

2020/12/22 07:19

投稿

A_kirisaki
A_kirisaki

スコア2853

test CHANGED
@@ -21,3 +21,95 @@
21
21
  ```
22
22
 
23
23
  が正しいです。また `readEvents` の使い方も `this.props.readEvents` になるのでご注意を。
24
+
25
+
26
+
27
+ ### 追記
28
+
29
+ 型定義は
30
+
31
+ ```TypeScript
32
+
33
+ // import { Dispatch } from 'redux'
34
+
35
+ export type Entity = {
36
+
37
+ taskId: number,
38
+
39
+ title: string,
40
+
41
+ description: string,
42
+
43
+ status: string,
44
+
45
+ createTime: string,
46
+
47
+ updateTime: string,
48
+
49
+ tag?: string[],
50
+
51
+ }
52
+
53
+
54
+
55
+ export type Entities = Entity[]
56
+
57
+
58
+
59
+ export type Action = {
60
+
61
+ type: string,
62
+
63
+ data: Entity,
64
+
65
+ }
66
+
67
+
68
+
69
+ export type Props = {
70
+
71
+ state: Entity,
72
+
73
+ dispatch: Dispatch,
74
+
75
+ }
76
+
77
+ ```
78
+
79
+ とすると丸く収まるでしょう。`interface` の使いどころがいまいちなので `type` にしてますが `interface` でも動くと思います。多分。すると `reducer` は
80
+
81
+ ```TypeScript
82
+
83
+ export default (events = initialState, action: Entities) => {
84
+
85
+ ...
86
+
87
+ ```
88
+
89
+ と書けるので `dispatch` は
90
+
91
+ ```TypeScript
92
+
93
+ // import { Dispatch } from 'redux'
94
+
95
+ export function readEvents(dispatch: Dispatch) {
96
+
97
+ dispatch({ type: "READ_EVENTS", entities });
98
+
99
+ }
100
+
101
+ ```
102
+
103
+ 型を付けて `entities` に変えときました。あと `async` 原因ちゃうん?ということで取っ払い。本格的に `dispatch` を書くなら
104
+
105
+ ```TypeScript
106
+
107
+ export functionAddEntity(dispatch: Dispatch){
108
+
109
+ return (entity: Entity) => {{ type: "ADD_ENTITY", entity }}
110
+
111
+ }
112
+
113
+ ```
114
+
115
+ みたいに関数を返すことになるでしょう。その時の `Action` 型定義は頑張ってください!