質問編集履歴
2
タイトル変更
test
CHANGED
@@ -1 +1 @@
|
|
1
|
-
イベントハンドラに
|
1
|
+
イベントハンドラにidを引数としてvuexに保存したい。
|
test
CHANGED
@@ -1,40 +1,18 @@
|
|
1
|
-
selectboxで選択した値
|
1
|
+
selectboxで選択した値に紐づくidをvuexに保存したいです。
|
2
2
|
|
3
|
-
|
3
|
+
現在イベントで引数を指定しましたがundifindeになってしましいます。
|
4
4
|
|
5
|
-
どなたかご教
|
5
|
+
どこが間違っているのかどなたかご存じでしたらご教示お願い致します。
|
6
6
|
|
7
7
|
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
```
|
12
|
-
|
13
|
-
-Item.vue-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
let items = [
|
18
|
-
|
19
|
-
{
|
20
|
-
|
21
|
-
"id": "1",
|
22
|
-
|
23
|
-
"urlname": "googl"
|
24
|
-
|
25
|
-
}]
|
26
|
-
|
27
|
-
this.$store.commit('setItems', items)
|
28
|
-
|
29
|
-
```
|
30
8
|
|
31
9
|
```javascript
|
32
10
|
|
33
11
|
export const state = () => ({
|
34
12
|
|
35
|
-
items: [],
|
13
|
+
items: [{"id": "1", "urlname": "google"}],
|
36
14
|
|
37
|
-
selectedI
|
15
|
+
selectedUrlId: []
|
38
16
|
|
39
17
|
})
|
40
18
|
|
@@ -50,7 +28,7 @@
|
|
50
28
|
|
51
29
|
setSelectedItem (state, payload) {
|
52
30
|
|
53
|
-
state.selectedI
|
31
|
+
state.selectedUrlId = payload
|
54
32
|
|
55
33
|
}
|
56
34
|
|
@@ -66,7 +44,7 @@
|
|
66
44
|
|
67
45
|
<div>
|
68
46
|
|
69
|
-
<select @change="updateSelect(item
|
47
|
+
<select @change="updateSelect(item.id)">
|
70
48
|
|
71
49
|
<option v-for="(item, index) in items" :key="index" >{{ item.urlname}}</option>
|
72
50
|
|
@@ -100,11 +78,11 @@
|
|
100
78
|
|
101
79
|
methods: {
|
102
80
|
|
103
|
-
updateSelect (id
|
81
|
+
updateSelect (id) {
|
104
82
|
|
105
|
-
console.log('id,event', id
|
83
|
+
console.log('id,event', id) //id ←undifinedになります。
|
106
84
|
|
107
|
-
this.$store.commit('setSelectedItem',
|
85
|
+
this.$store.commit('setSelectedItem', id)
|
108
86
|
|
109
87
|
}
|
110
88
|
|
1
タイトル名変更
test
CHANGED
@@ -1 +1 @@
|
|
1
|
-
|
1
|
+
イベントハンドラに複数を引数を渡してvuexに保存したい。
|
test
CHANGED
@@ -1,8 +1,8 @@
|
|
1
|
-
|
1
|
+
selectboxで選択した値とidをvuexに保持させたいです。
|
2
2
|
|
3
|
-
|
3
|
+
@changeイベントで引数を渡しましたがundifindeになってしまいます。
|
4
4
|
|
5
|
-
|
5
|
+
どなたかご教授いただければ幸いです。
|
6
6
|
|
7
7
|
|
8
8
|
|
@@ -32,7 +32,9 @@
|
|
32
32
|
|
33
33
|
export const state = () => ({
|
34
34
|
|
35
|
-
items: []
|
35
|
+
items: [],
|
36
|
+
|
37
|
+
selectedItems: []
|
36
38
|
|
37
39
|
})
|
38
40
|
|
@@ -43,6 +45,12 @@
|
|
43
45
|
setItems (state, payload) {
|
44
46
|
|
45
47
|
state.items = payload
|
48
|
+
|
49
|
+
},
|
50
|
+
|
51
|
+
setSelectedItem (state, payload) {
|
52
|
+
|
53
|
+
state.selectedItems = payload
|
46
54
|
|
47
55
|
}
|
48
56
|
|
@@ -58,7 +66,7 @@
|
|
58
66
|
|
59
67
|
<div>
|
60
68
|
|
61
|
-
<select>
|
69
|
+
<select @change="updateSelect(items.id,$event)">
|
62
70
|
|
63
71
|
<option v-for="(item, index) in items" :key="index" >{{ item.urlname}}</option>
|
64
72
|
|
@@ -88,6 +96,20 @@
|
|
88
96
|
|
89
97
|
}
|
90
98
|
|
99
|
+
},
|
100
|
+
|
101
|
+
methods: {
|
102
|
+
|
103
|
+
updateSelect (id, event) {
|
104
|
+
|
105
|
+
console.log('id,event', id, event) //id,event ←undifinedになります。
|
106
|
+
|
107
|
+
this.$store.commit('setSelectedItem', event.target.value)
|
108
|
+
|
109
|
+
}
|
110
|
+
|
111
|
+
}
|
112
|
+
|
91
113
|
}
|
92
114
|
|
93
115
|
</script>
|