回答編集履歴

1

コードの追加

2020/03/30 22:45

投稿

退会済みユーザー
test CHANGED
@@ -1 +1,119 @@
1
- Organisms側から関数などを渡す。
1
+ Organisms側から関数などを渡す。(最適かどうかは別として、最低限の動作はする)
2
+
3
+
4
+
5
+ ```JavaScript
6
+
7
+ import React, { Component } from 'react';
8
+
9
+
10
+
11
+ import Counter from './atoms/Counter';
12
+
13
+ import Btn from './atoms/Btn';
14
+
15
+
16
+
17
+ export default class Organisms extends Component {
18
+
19
+ constructor(props) {
20
+
21
+ super(props);
22
+
23
+ this.handleClick = this.handleClick.bind(this);
24
+
25
+ this.state = {
26
+
27
+ count: 0,
28
+
29
+ }
30
+
31
+ }
32
+
33
+
34
+
35
+ handleClick() {
36
+
37
+ this.setState({
38
+
39
+ count: this.state.count + 1,
40
+
41
+ })
42
+
43
+ }
44
+
45
+
46
+
47
+ render()
48
+
49
+ {
50
+
51
+ return(
52
+
53
+ <>
54
+
55
+ <Counter count={this.state.count} onClick={this.handleClick}/>
56
+
57
+ <Btn text="Click!" onClick={this.handleClick}/>
58
+
59
+ </>
60
+
61
+ );
62
+
63
+ }
64
+
65
+ }
66
+
67
+
68
+
69
+ ```
70
+
71
+
72
+
73
+ ```JavaScript
74
+
75
+ import React, { Component } from 'react';
76
+
77
+
78
+
79
+ const Btn = (props) => {
80
+
81
+ return(
82
+
83
+ <button onClick={props.onClick}>{props.text}</button>
84
+
85
+ );
86
+
87
+ }
88
+
89
+
90
+
91
+ export default Btn;
92
+
93
+
94
+
95
+ ```
96
+
97
+ ```JavaScript
98
+
99
+ import React, { Component } from 'react';
100
+
101
+
102
+
103
+ const Counter = (props) => {
104
+
105
+ return(
106
+
107
+ <h3>{props.count}</h3>
108
+
109
+ );
110
+
111
+ }
112
+
113
+
114
+
115
+ export default Counter;
116
+
117
+
118
+
119
+ ```