2

Я новичок. Есть массив городов, выводится в span. Надо чтобы между элементами был разделитель. Cделал так:

<span v-for="city in users_cities">{{city}}, </span>

Но получается так, что выводится вот так вывод массива

То есть выводится первая пустая запятая и в конце. Хотелось бы, чтобы запятые были только между элементами. Заранее спасибо!

1 ответ 1

1

Используя условную отрисовку(директиву v-if), проверяете индекс текущего элемента на каждом шагу итерации и выводим запятые для всех кроме последнего, как:

new Vue({
  el: '#app',
  data() {
    return {
      users_cities: ['Город1', 'Город2', 'Город3', 'Город4', ]
    }
  }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.min.js"></script>
<div id="app">
  <span v-for="(city,index) in users_cities">
  {{city}}<template v-if="index<users_cities.length-1">,</template>
  </span>
</div>

1
  • Спасибо большое!
    – intskull
    24 дек 2020 в 12:18

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.