I created an API that returns JSON using Laravel.
I want to pass this to vue.js and do the drawing process, but only theshowevent ofmethodsdoes not work,
From the following code, the contents of JSON are called so thatshow1of methods is placed in the@ click = "article.show"part, and is defined in another component This code is displayed by the modal.
show1is in the JSON, but I don't really think it should fire the event this way ...
Please let me know if there is any other good way.

<template>
  <v-app>
    <v-row justify = "center">
      <v-col v-for = "(article, id) in articles": key = "id">
        <v-card elevation = 20 slot = "activator" @ click = "article.show">
          <v-img height = "200px" v-bind: src = "article.image" alt = "">
            <v-card-title>{{article.title}}</v-card-title>
          </v-img>
          <v-card-subtitle>{{article.date}}</v-card-subtitle>
          <v-card-text>
             {{article.name}} 
             {{article.place1}} 
             {{article.place2}} 
          </v-card-text>
        </v-card>
      </v-col>
    </v-row>
    <My-component ref = "dialog1"></My-component>
  </v-app>
</template>
<script>
  import My-component from "./my-component";
  import axios from 'axios';
  export default {
    name: "ArticleCard",
    methods: {
      show1 () {
        this. $refs.dialog1.open ();
      },
    components: {
      My-component
    },
    data () {
      return {
        articles: [],
      }
    },
    mounted () {
      axios
          .get ("http://127.0.0.1:8000/api/articles/")
          .then (response =>(this.articles = response.data))
    }
  }
</script>
<style scoped>
  .card {
    max-width: 400px;
    max-height: 320px;
    margin: 0 auto;
    ovarflow-y: hidden;
  }
  .title {
    margin-bottom: -15px;
  }
  .name {
    margin-bottom: 5px;
  }
</style>

[{"id": 1, "show": "show1", "image": "img \ /image1.jpeg", "title": "\ u90fd \ u96fb \ u8352 \ u5ddd \ u7dda \ u5b66 \ u7fd2 \ u9662 \ u4e0b \ u99c5 \ u8e0f \ u5207 "," date ":" 2019 \ u5e7411 \ u67081 \ u65e5 "," name ":" \ u30a2 \ u30cb \ u30e1: \ u51b4 \ u3048 \ u306a \ u3044 \ u5f7c \ u5973 \ u306e \ u80b2 \ u3066 \ u304b \ u305fOP "," place1 ":" \ u90fd \ u96fb \ u8352 \ u5ddd \ u7dda \ u5b66 \ u7fd2 \ u9662 \ u4e0b \ u99c5 \ u309u \ u964 \ u3059 \ u3050 \ u306e \ u8e0f \ u5207 "," place2 ": null}]