Как я переписываю этот код в VueJS, используя v-for?

#php #laravel #vue.js

#php #laravel #vue.js

Вопрос:

Как я использую следующий код в vuejs, используя v-for?

 @php $rating = 3; @endphp

@foreach(range(1,5) as $r)
<span class="fa-stack" style="width:1em">
    <i class="far fa-star fa-stack-1x"></i>

    @if($rating >0)
        @if($rating >0.5)
          <i class="fas fa-star fa-stack-1x"></i>
        @else
          <i class="fas fa-star-half fa-stack-1x"></i>
        @endif
    @endif

    @php $rating--; @endphp
</span>
@endforeach
  

Я использовал следующий метод. Но я понятия не имею, как я уменьшаю рейтинг.

 <span class="fa-stack" style="width:1em" v-for="r in 5">
    <i class="far fa-star fa-stack-1x"></i>
    <i class="fas fa-star fa-stack-1x" v-if="product.average_rating > 0  amp;amp; product.average_rating > 0.5"></i>
    <i class="fas fa-star-half fa-stack-1x" v-if="product.average_rating > 0  amp;amp; !(product.average_rating > 0.5)"></i>
</span>
  

Комментарии:

1. Перенос шаблона laravel с использованием vuejs

Ответ №1:

Я не думаю, что вы можете сделать так же, как в blade, но если это product.average_rating то, что вы хотите уменьшить, то вы могли бы заменить product.average_rating на (product.average_rating - r 1) везде в предоставленном вами блоке кода. Вот так:

 <span class="fa-stack" style="width:1em" v-for="r in 5">
    <i class="far fa-star fa-stack-1x"></i>
    <i class="fas fa-star fa-stack-1x" v-if="(product.average_rating - r   1) > 0  amp;amp; (product.average_rating - r   1) > 0.5"></i>
    <i class="fas fa-star-half fa-stack-1x" v-if="(product.average_rating - r   1) > 0  amp;amp; !((product.average_rating - r   1) > 0.5)"></i>
</span>
  

Комментарии:

1. можете ли вы привести пример?

2. @UttaraInfoTech обновил мой ответ примером.