Laravel eloquentを使ってlikeの合計を計算し、vue jsファイルに渡します

Question

現在、私はVUE jsを使ってlaravelプロジェクトに同様のシステムを実装しています。このシナリオはユーザーが投稿を好きになった後です。それは、同じようなボタンの横にある投稿のようなものを表示します。コントローラを使用している場合、データをビューに渡すのは簡単です。しかし、Vue jsに変更するとき、私はそれをどうやって行うのか分かりません。これは私のLike.vueファイルです。

<template> 

<button class="btn btn-primary" v-if="!auth_user_likes_post" @click="like()"> 
    Support 
</button> 

<button class="btn btn-primary" v-else @click="unlike()"> 
    Unsupport 
</button> 

export default { 
    mounted(){ 

    }, 

    props: ['id'], 

    computed: { 
     likers() { 
      var likers = [] 

      this.post.likes.forEach((like) => { 
       likers.push(like.user.id) 
      }) 
      return likers 
     }, 
     auth_user_likes_post() { 
      var check_index = this.likers.indexOf(
       this.$store.state.auth_user.id 
      ) 
      if (check_index === -1) 
       return false 
      else 
       return true 
     }, 
     post() { 
      return this.$store.state.posts.find((post) => { 
       return post.id === this.id 
      }) 
     } 
    }, 
    methods: { 
     like() { 
      this.$http.get('/like/' + this.id) 
       .then((resp) => { 
        this.$store.commit('update_post_likes', { 
         id: this.id, 
         like: resp.body 
        }) 

       }) 
     }, 
     unlike() { 
      this.$http.get('/unlike/' + this.id) 
       .then((response) => { 
        this.$store.commit('unlike_post', { 
         post_id: this.id, 
         like_id: response.body 
        }) 
       }) 
     } 
    } 
} 

のようなとは異なり機能が行われ、完璧に取り組んできました。今度は総数を表示するだけです。

これはFeed.vueファイルです。このようなものがこのページに追加されました。

<div class="post-description"> 
        <p>{{ post.content }}</p> 
        <div class="stats"> 
         <like :id="post.id"></like> 
         <a href="#" class="stat-item"> 
          <i class="fa fa-retweet icon"></i>12 
         </a> 
         <a href="#" class="stat-item"> 
          <i class="fa fa-comments-o icon"></i>3 
         </a> 
        </div> 
       </div> 

私の機能が期待されたシナリオを達成できない場合は、それを行うための他の方法をお勧めできますか？

Answer 1

返された配列には、好きなものがあります。しかし、これを使用しても私の目標を達成することはできますが、初めは決してありません。したがって、この{{likers.length}}は実際には合計数を表示できます。