Как предотвратить добавление новой строки в массив .pu sh? - PullRequest
0 голосов
/ 09 апреля 2020

Это метод для создания входных тегов, которые могут быть выборочно удалены пользователем. В идеале я хотел бы, чтобы массив тегов располагался в одной строке. В настоящее время, однако, каждый тег находится на новой строке. Я подозреваю, что это .pu sh, но я так и не смог выяснить, почему.

<template>
<div>
  <form>
    <div class="input-wrapper">
      <input type="text" v-model.trim="tag" placeholder="Type here" @keypress.prevent.stop.enter="addTag">
      <button @click.prevent.stop="addTag">Add</button></div><br>

    <div class="tag" v-for="(tag, index) in tags" :key="index">
      <span>{{ tag }}</span><span class="delete" @click="tags.splice(index, 1)"> &times;</span></div>

    <div class="item">
      <button type="reset" on:click="resetProgress">Reset</button>
      <button type="submit" value="submit">Submit</button></div>
  </form>
</div>
</template>


<script>
export default {
  props: {
    value: {
      type: Array,
      default: () => []
      }
  },

  watch: {
    tags(n, o) {
      this.$emit('input', n);
    }
  },

  data() {
    return {
      tag: '',
      tags: this.value || [],
    };
  },

  methods: {
    addTag() {
      if (this.tag && ! this.tags.includes(this.tag)) {
        this.tags.push(this.tag);
        this.tag = '';
      }
    },
  }
}
</script>
...