Netlify CMS から画像の配列を取得し、それをvue-picture-swipe
コンポーネントに渡していますが、パスが正しい場合でも、実際の画像はレンダリングされません。
私が間違っているのかわかりませんか?
テンプレート
vue-picture-swipe(:items="items")
脚本
<script>
export default {
data: function() {
return {
items: []
};
},
created: function () {
this.imageList()
},
methods: {
imageList: function () {
const files = require.context('~/content/gallery/images/', false, /\.md$/);
let images = files.keys().map(key => ({
...files(key)
}));
let items = images.map(function(value) {
return {
'src': value.attributes.imgSrc,
'thumbnail': value.attributes.imgSrc,
'alt': value.attributes.imgDesc
}
});
return this.items = items
}
}
};
</script>
レンダリングされた HTML
<img src="/assets/uploads/image.jpg" alt="Test Image description" itemprop="thumbnail">