JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.3/vue.js"></script>
<div id="posts">
<posts 
v-for="(post, index) in posts"
v-on:hidePost="hidePost"
v-bind:text="post.text">
</posts>
</div>

JavaScript

Vue.component('posts', {
    template: '<article>{{ text }}<button  v-on:click="hidePost">Hide</button></article>',
    props: ['text']
})

new Vue({
    el: '#posts',
    data: {

        posts: [{
                "text": "text1"
            },
            {
                "text": "text2"
            },
            {
                "text": "text3"
            }
        ],

    },
    methods: {
        hidePost: function() {
            alert(0)
        }
    }
})