如何使用vue.js直接在數據庫中更改upvotes和downvotes？

我從DATABSE dislaying我的意見：如何使用vue.js直接在數據庫中更改upvotes和downvotes？

@foreach($comments as $comment) 
       <div class="comment_list"> 
       <div class="row"> 
        <div class="col-md-1 col-sm-1 col-xs-1"> 
        <div class="user_profile_image {{ isset($comment->user->personal_user) ? 'bg_blue' : 'bg_green'}}"> 
         @if(isset($comment->user->avatar) && $comment->user->avatar != '') 
         <div class="profile-image"><img src="{{ avatar_path($comment->user->avatar) }}" alt="" /></div> 
         @else 
          <div class="profile-image {{ isset($comment->user->personal_user) ? 'bg_blue' : 'bg_green' }}"><img src="{{ home_asset('img/user_icon.png') }}" alt="" /></div> 
         @endif 
        </div> 
        </div> 
        <div class="col-md-11 col-sm-11 col-xs-11"> 
        <div class="comments"> 
         <div class="post"><span class="post_name">{{ isset($comment->user->personal_user) ? $comment->user->personal_user->first_name .' '.$comment->user->personal_user->last_name : $comment->user->business_user->company_name }}</span><span class="post_date"> - {{ \Carbon\Carbon::createFromTimeStamp(strtotime($comment->created_at))->diffForHumans() }} 
         </span></div> 
         <p>{{ $comment->comment }}</p> 

        </div> 
        <ul class="comment_buttons"> 
         <li>{{ $comment->downvotes }} <i class="fa fa-angle-down" @click="downvote" :class="{disabled: downvoted}"></i></li> 
         <li>{{ $comment->upvotes }} <i class="fa fa-angle-up" @click="upvote" :class="{disabled: upvoted}"></i></li> 
         <li><a href="#">REPLY</a></li> 
         <li><a href="#">SHARE</a></li> 
        </ul> 
        </div> 
       </div> 
       </div> 
      @endforeach

我想是當上給予好評或downvote用戶點擊改變他們的價值，並將其保存到數據庫中。在vue.js我有這樣的方法：

methods: { 
    upvote: function() { 
     this.upvoted = !this.upvoted; 
     this.downvoted = false; 
    }, 
    downvote: function() { 
     this.downvoted = !this.downvoted; 
     this.upvoted = false; 
    } 
    }, 
    computed: { 
    upvotes: function() { 

     if (this.upvoted) { 
     return this.post.upvotes + 1; 
     } 
     else { 
     return this.post.upvotes; 
     } 

    }, 
    downvotes: function(){ 
     if(this.downvoted){ 
     return this.post.downvotes -1; 
     } 
     else{ 
     return this.post.downvotes; 
     } 
    }

任何建議，我怎麼能做到這一點？

來源

2017-01-09 None

你必須使用VUE資源，做後/ get請求對upvotes/downvotes方法服務器 – Miguel

建議是構建RESTful API - 與Laravel它不該並不難。然後，您可以通過API向API enpoints發出相應的HTTP請求並在您的數據庫中進行更新。 –

VueJS是前端框架，所以你不能使用它來操作數據庫。
使用動作創建2條路線，例如/api/vote/up/{id}和/api/vote/down/{id}
在您的組件中，您的項目需要一些id（文章，評論等）。
4.使用例如Axios創建getrequests，比如`Vue.axios.get（'/ api/vote/down /'+ this.objectID）。
利用Laravel處理向上/向下表決

來源

2017-01-09 15:42:00

如何使用vue.js直接在數據庫中更改upvotes和downvotes？

回答

相關問題