Как изменить отложенный запрос jquery для использования Vue nexttick?

#javascript #vue.js #vuex #deferred

Вопрос:

Мне нужно это изменить, так как я прочитал, что nextTick-лучший вариант по сравнению с отложенным.

Это исходный код, который хорошо работает:

 methods: {  ...mapActions(['fetchOverdraftLogs', 'setOverdraftFilters', 'fetchUserEventsCsvFile']), },  computed: {  ...mapGetters(['getOverdraftLogs'])  }, ...  loadData: filters =gt; {  const d = $.Deferred()  this.fetchOverdraftLogs({ params: this.filtersToSend(filters) })  .then(res =gt; {  d.resolve(this.getOverdraftLogs)  this.setFilterValues()  })  return d.promise()  })  }  

Однако я не могу переработать это с помощью nextTick:

 loadData: filters =gt; {  this.fetchOverdraftLogs({ params: this.filtersToSend(filters) })  this.$nextTick(() =gt; {  this.setFilterValues()  this.getOverdraftLogs  }) }  

Мне нужно убедиться, что для сетки после вызова API она считывает данные из состояния.

Не могли бы вы помочь?

Ответ №1:

Отложенный шаблон, как правило, является антипаттером, особенно с обещаниями ES. Это не альтернатива nextTick . Обещания уже асинхронны, обещание, которое мгновенно выполняется, обеспечивает небольшую задержку. nextTick обеспечивает задержку, достаточную для обновления DOM.

nextTick поддерживает обещания, но здесь это не нужно.

Это должно быть:

 loadData: filters =gt; {  return this.fetchOverdraftLogs({ params: this.filtersToSend(filters) })  .then(() =gt; {  this.setFilterValues()  return this.getOverdraftLogs;  })  }  

Действия Vuex не должны возвращать данные, с которыми они работают, поэтому их не должно быть res .