ループ内の特定のdivにロードする

Question

これはこのフォーラムの最初の質問です。私はしばらくjqueryを使用していましたが、最近私は最近vuejsに移行し、素晴らしいことが分かりました。

ここに私が持っている小さなヒッチがあります。問題はループ内のボタンにv-loadingを設定しなければならないことです。クリックすると、それが真（つまり、表示を開始する）になる必要があります。これは私がそれをした方法ですが、私はそれを引き起こす方法がわかりません。

<div class="col-sm-12" style="padding:0;" v-for="follow_request in follow_requests" v-loading.body="true"> 
    <div class="col-sm-4"> 
    <img class="img-circle" :src="follow_request.user.image | appendBaseUrl" 
     style="height:60px;"/> 
    </div> 
</div> 


v-loading.body="true" 

私は、クリックでそれが真と偽にする必要がありますが、これだけ特定div。

Answer 1

通常は、オブジェクトを反復処理している状態を表すプロパティをオブジェクトに追加することをお勧めします。 follow_requestsアレイ内のfollow_requestオブジェクトのそれぞれについて、プロパティーloadingを追加します。

テンプレートで使用できます。

<div class="col-sm-12" 
    style="padding:0;" 
    v-for="follow_request in follow_requests" 
    v-loading.body="follow_request.loading" 
    @click="follow_request.loading = !follow_request.loading>