Как добавить дополнительный текст при выполнении запроса POST?

Question

Я получил приложение Vue с текстовым полем ввода в форме, где пользователь может ввести новое имя для branch. Пользователь также может установить флажок, чтобы указать, является ли ветвь active или inactive. Затем он отправляет форму с помощью кнопки отправки, которая затем отправляет запрос POST (или PUT, если он редактирует существующие данные) в API удаленных данных.

Демонстрационный скриншот:

Мой вопрос: Мне нужно добавить текст (inactive) к имени ветви, когда он передается на сервер, если activeфлажок не установлен, но также необходимо удалить этот неактивный текст, если он существует, а флажок active не установлен:

Гипотетическое имя ветви с неактивным флагом и флажок не установлен:

ABCD (inactive)

Гипотетическое имя ветви, если установлен флажок:

ABCD 

Вот пример кода для моего метода POST:

onSubmitAdd() {
  this.loading = true
  ApiService.postBranch(this.branch)
    .then(() => {
      this.loading = false
      this.$router.push({ path: '/branches' })
    })
    .catch(err => {
      if (err.response) {
        this.errors = err.response.data
      } else {
        if (err.request) {
          this.errors = err.request
        } else {
          this.errors = err.message
        }
      }
      this.loading = false
      console.error('Error from post', err)
    })
}

Спасибо за любые советы, которые вы можете предоставить для логики, чтобы это произошло!

Answer 1

Добавьте v-модель с установленным флажком, и на основе этого ввода вы можете решить, добавлять или нет неактивный текст в вашу onSubmitAdd функцию