質問編集履歴
1
回答を受けて修正した点を追記しました。
title
CHANGED
File without changes
|
body
CHANGED
@@ -75,4 +75,27 @@
|
|
75
75
|
</script>
|
76
76
|
```
|
77
77
|
`showLightbox`内の`show(imageName)`のところで画像のパスを渡せていないと思われるのですが,どのように設定したらクリック後の画像が表示されるでしょうか.
|
78
|
-
ご教授いただければ幸いです.
|
78
|
+
ご教授いただければ幸いです.
|
79
|
+
|
80
|
+
#追記
|
81
|
+
回答を受けての修正です。
|
82
|
+
App.vue
|
83
|
+
```
|
84
|
+
// template
|
85
|
+
<img v-for="thumb in filteredImages" :key="thumb.id" @click="showLightbox(thumb.name)" :src="thumb.name" :alt="thumb.alt" :title="thumb.alt" />
|
86
|
+
|
87
|
+
// script
|
88
|
+
var imageList = [
|
89
|
+
{'name': require('@/assets/gazo1.png'), 'alt':'画像1', 'filter':'nature', 'id':'image1' },
|
90
|
+
{ ~画像2 省略~ }
|
91
|
+
];
|
92
|
+
|
93
|
+
// export default
|
94
|
+
data () {
|
95
|
+
return {
|
96
|
+
// thumbnailDir は削除
|
97
|
+
images: imageList,
|
98
|
+
galleryFilter: 'all',
|
99
|
+
}
|
100
|
+
},
|
101
|
+
```
|