Skip to content

Instantly share code, notes, and snippets.

@miminari
Last active June 29, 2020 20:26
Show Gist options
  • Save miminari/0acdc3d6e1197eb782b51b56f8b14284 to your computer and use it in GitHub Desktop.
Save miminari/0acdc3d6e1197eb782b51b56f8b14284 to your computer and use it in GitHub Desktop.
<article class="m-article" v-for="post in posts">
<div class="m-media">
<a v-bind:href="post.link">
<template v-if="post._embedded['wp:featuredmedia']">
<img :src="post._embedded['wp:featuredmedia'][0].source_url" alt="">
</template>
</a>
</div>
<div class="m-txts">
<a v-bind:href="post.link">
<h3 class="m-ttl">{{post.title.rendered}}</h3>
<div class="m-txt" v-html="post.excerpt.rendered"></div>
</a>
<div class="m-musthead">
<span class="m-date">{{post.date| moment}}</span>
<span class="m-tag__container">
<template v-if="post.terms['タグ']">
<span class="m-tag" v-for="(tag,index) in post.terms['タグ']">{{tag.name}}</span>
</template>
</span>
</div>
</div>
</article>
const vm = new Vue({
el: '#app',
filters: {
moment: function (date) {
return moment(date).format('YYYY/MM/DD HH:mm');
}
},
data: {
posts: []
},
created() {
axios.get("/wp-json/wp/v2/posts?_embed&per_page=3")
.then(response => {this.posts = response.data;})
.catch( error => {
window.alert( error );
} );
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment