Пропустить наблюдателя в vueJS

Question

У меня есть форма для обновления сущности документа.

Сущность документа состоит из списка сотрудников (который представляет собой массив объектов), и у каждого сотрудника есть сообщение, представляющее собой просто строку.

У меня есть раскрывающийся список (вид оболочки для vue-multiselect), который принимает массив сотрудников и синхронизирует выбранного сотрудника с переменной selectedEmployee в data().

А также у меня есть наблюдатель для selectedEmployee, который автоматически устанавливает значение post, когда сотрудник выбирается в раскрывающемся списке.

Итак, при создании документа в форме все в порядкеОднако, когда я обновляю документ, я извлекаю существующий документ с сервера, устанавливаю selectedEmployee и устанавливаю должность сотрудника.Но документ также сохраняет сообщение сотрудника , поэтому при первом открытии формы документа для его обновления я не хочу автоматически обновлять публикацию документа.Я хочу, чтобы он обновлялся только тогда, когда пользователь сам выбирает сотрудника.

Но наблюдатель также вызывается в первый раз.

Итак, представьте, что у нас есть Джон Доу и его менеджер.Когда я создаю документ, я меняю его пост на дизайнера.Затем я открываю форму документа, чтобы обновить ее, и должен увидеть, что для этого конкретного документа пост Джона Доу «дизайнер», но вызывается наблюдатель и возвращает сообщение менеджеру.

Iпопытался создать поддельную переменную в data (), например doneFetching, но она работает только в том случае, если я обновляю эту переменную непосредственно в watcher, что выглядит довольно опасно, к тому же в других организациях у меня много разных типов выбранных сотрудников, поэтомутонны поддельных флагов - не вариант.

Вот пример реального кода (сотрудник = представитель в моем случае):

  selectedApproveRepresentative(representative) {
    if (!representative) {
      this.memoData.approve_representative_id = null
      return
    }

    this.memoData.approve_representative_id = representative.id

    // Here is temporary solution, but I have many watchers for many different kinds of employees. If I move the doneFetching flag after I initialized the form, it'll be set to true, and only after that the watcher will be called
    if (this.mode === 'update' && !this.doneFetching) {
      this.doneFetching = true
      return
    }

    // In normal case a representative might have or have not post, so depending on this case we set it to be empty or filled. But this should not be called the first time I open the form
    this.memoData.approve_representative_post_dative_case =
      representative.post_dative_case ?
      representative.post_dative_case : ''
  },

Здесь я инициализирую данные:

created() {
  if (this.memo) {
    this.memoData = _.cloneDeep(this.memo)
    this.selectedApproveRepresentative   = _.cloneDeep(this.memo.approve_representative)

  }
},

Answer 1

, как я понял, ваша проблема - наблюдатель, выполняемый при запуске компонента.Вы пытались установить непосредственное свойство наблюдателя в false?

Не все знают, что наблюдатели могут быть определены по-разному.

Простой, который всем известен

watchers: {
   propertyToWatch() { //code... }
}

Передача имени функции в виде 'string'

watchers: {
   propertyToWatch: 'nameOfAfunctionDefinedInMethodsSection'
}

Объявление объекта

Это наиболее описательный способ объявления наблюдателя.Вы пишете его как объект со свойством обработчика (это может быть имя функции, переданной в виде строки, как указано выше), и другими свойствами, такими как deep для просмотра вложенных свойств объекта, или в вашем случае immediate, который сообщаетнаблюдателю, если он должен запускаться сразу после установки компонента.

watchers: {
   propertyToWatch: {
      immediate: false,
      handler: function() { //code.. }
   }
}