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
    Commented 24 дек. 2020 в 12:18

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

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