<div id="app">
  <div class="form_wrapper">
    <form v-on:submit="sendDeleteNumber">
      <input class="form-text" type="text"　v-model="textNonPrevent">
      <br>
      <input class="form-button" type="submit" value="submitで送信">
    </form>
  </div>
  <div class="form_wrapper">
    <form v-on:submit.prevent="sendKeepNumber">
      <input class="form-text" type="text" v-model="textPrevent">
      <br>
      <input class="form-button" type="submit" value="submit.preventで送信">
    </form>
  </div>
</div>

#app {
  text-align: center;
}

.form_wrapper {
  background-color: #aaa;
  width: 150px;
  margin: 10px auto;
  padding: 5px;  
}

.form-text {
  border: 1px solid #444;
  border-radius: 3px;
  height: 1.3rem;
  width: 100%;
}

.form-button {
  border: #aaa;
  background-color: #F9AA40;
  color: #fff;
}

const app = new Vue({
  el: "#app",
  data: {
    textPrevent: '',
    textNonPrevent: ''
  },
  methods: {
    sendKeepNumber() {
      alert(`「${this.textPrevent}」をどこかに送信！formはそのまま残るよ！`)
    },
    sendDeleteNumber() {
      alert(`「${this.textNonPrevent}」をどこかに送信！ついでに画面更新しちゃうよ`)
    }
  }
})