質問編集履歴
2
内容変更
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -57,9 +57,9 @@
|
|
|
57
57
|
super(props);
|
|
58
58
|
this.state = {
|
|
59
59
|
prefecture_list: [],
|
|
60
|
-
prefeture_selected:
|
|
60
|
+
prefeture_selected: 0,
|
|
61
61
|
city_list: [],
|
|
62
|
-
city_selected
|
|
62
|
+
city_selected: 0
|
|
63
63
|
}
|
|
64
64
|
}
|
|
65
65
|
|
1
対応内容の更新
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -51,11 +51,45 @@
|
|
|
51
51
|
}
|
|
52
52
|
}
|
|
53
53
|
```
|
|
54
|
-
|
|
54
|
+
|
|
55
55
|
```
|
|
56
56
|
constructor(props) {
|
|
57
57
|
super(props);
|
|
58
|
+
this.state = {
|
|
59
|
+
prefecture_list: [],
|
|
60
|
+
prefeture_selected: '',
|
|
61
|
+
city_list: [],
|
|
62
|
+
city_selected
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
getPrefectureList = async () => {
|
|
67
|
+
this.setState({prefectures: result.data.prefecture});
|
|
68
|
+
|
|
69
|
+
const prefectures = this.state.prefecture.map((line) => {
|
|
70
|
+
return {
|
|
71
|
+
prefecuture_id: line.prefecuter_id,
|
|
72
|
+
prefecuture_name: line.prefecture_name
|
|
73
|
+
}
|
|
74
|
+
});
|
|
75
|
+
this.setState({result.data.prefecture_list: prefectures})
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
handleChangePrefecture = (value) => {
|
|
58
|
-
|
|
79
|
+
this.setState({prefecture_selected: value});
|
|
80
|
+
|
|
81
|
+
const selectedPrefecture = this.state.prefecuture_list.filter(line=> {
|
|
82
|
+
if (line.prefecture_id === this.state.prefecture_selected + 1) {
|
|
83
|
+
return line;
|
|
84
|
+
}
|
|
85
|
+
});
|
|
86
|
+
|
|
87
|
+
// ** 市町村データ取得
|
|
88
|
+
const citys = selectedPrefecture.map((line) => {
|
|
89
|
+
return line.city_list;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
this.setState({city_list: citys[0]);
|
|
59
93
|
}
|
|
60
94
|
|
|
61
95
|
this.setState({prefecture_list: result.data,prifecture_list})
|
|
@@ -63,7 +97,17 @@
|
|
|
63
97
|
|
|
64
98
|
### プルダウンAに都道府県名を展開
|
|
65
99
|
````
|
|
100
|
+
render () {
|
|
101
|
+
|
|
102
|
+
const handleChange = (e) => {
|
|
103
|
+
this.setState({[e.target.name]: e.target.value})
|
|
104
|
+
}
|
|
105
|
+
|
|
66
106
|
<Select>
|
|
107
|
+
name="prifecture_selected"
|
|
108
|
+
id="prefecture_selected"
|
|
109
|
+
value={this.state.prefecture_selected}
|
|
110
|
+
onChange={(e) => this.handleChangePrefecture(e.target.value)}
|
|
67
111
|
<MenuItem value={""}> </MenuItem>
|
|
68
112
|
{this.state.prefecture_list.map(line => {
|
|
69
113
|
return (
|
|
@@ -77,8 +121,29 @@
|
|
|
77
121
|
})}
|
|
78
122
|
</Select>
|
|
79
123
|
<Select>
|
|
124
|
+
<Select>
|
|
125
|
+
name="city_selected"
|
|
80
|
-
|
|
126
|
+
id="city_selected"
|
|
127
|
+
value={this.state.city_selected}
|
|
128
|
+
onChange={(e) =>
|
|
129
|
+
this.setState({
|
|
130
|
+
[e.target.name]: e.target.value
|
|
131
|
+
})
|
|
132
|
+
})
|
|
133
|
+
<MenuItem value={""}> </MenuItem>
|
|
134
|
+
{this.state.city_list.map(line => {
|
|
135
|
+
return (
|
|
136
|
+
<MenuItem
|
|
137
|
+
value={line.city_id}
|
|
138
|
+
key={line.city_id}
|
|
139
|
+
>
|
|
140
|
+
{line.city_name}
|
|
141
|
+
</MenueItem>
|
|
142
|
+
)
|
|
143
|
+
})}
|
|
81
144
|
</Select>
|
|
145
|
+
</Select>
|
|
146
|
+
}
|
|
82
147
|
|
|
83
148
|
````
|
|
84
149
|
|