Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770
Форумы портала PHP.SU :: Версия для печати :: Для чего в axios-запрос Promise - обертка ?
Форумы портала PHP.SU » Клиентская разработка » JavaScript & VBScript » Для чего в axios-запрос Promise - обертка ?

Страниц (1): [1]
 

1. mstdmstd - 29 Октября, 2019 - 18:49:27 - перейти к сообщению
Всем привет!

Разжуйте плиз что в axios.post запросе :
CODE (javascript):
скопировать код в буфер обмена
  1.     return new Promise((res, rej) => {
  2.         axios.post('/api/auth/login', credentials)
  3.             .then((response) => {
  4.                 setAuthorizationToken(response.data.access_token);
  5.                 res(response.data);
  6.             })
  7.             .catch((err) =>{
  8.                 rej("Wrong email or password");
  9.             })
  10.     })
  11.  

дает Promise - обертка ?
Ведь axios и так запрос асинхронный ?

Спасибо!
2. armancho7777777 - 30 Октября, 2019 - 14:58:10 - перейти к сообщению
Переопределение возвращаемых значений, плюс выполнение дополнительной операции прежде, чем вернуть результат.
3. mstdmstd - 31 Октября, 2019 - 09:17:20 - перейти к сообщению
А можно ссылочку с практическими примерами ?
Гуглив я находил опсания но в них тонул и только запутался...
4. armancho7777777 - 01 Ноября, 2019 - 07:29:13 - перейти к сообщению
С практическим примером чего?
Он у Вас и так есть.
5. mstdmstd - 01 Ноября, 2019 - 10:28:09 - перейти к сообщению
Я пытаюсь разобраться в каких случаях использование полезно и как его пользовть

У меня есть некоторый опыт работы с vuejs2 и обычно запросы я делаю что-то вроде :

CODE (javascript):
скопировать код в буфер обмена
  1.  
  2.             loadCustomer() {
  3.                 this.is_page_loaded = false
  4.                 axios.get(window.API_BACKEND_VERSION_LINK + '/admin/customers/' + this.customer_id, {})
  5.                     .then((response) => {
  6.                         this.customerRow = response.data.customer
  7.                         this.customerAccountTypeValueArray.map((nextCustomerAccountTypeValue, index) => {
  8.                             if (nextCustomerAccountTypeValue.key == this.customerRow.account_type) {
  9.                                 this.selection_account_type = {key: this.customerRow.account_type, label: nextCustomerAccountTypeValue.label};
  10.                             }
  11.                         });
  12.  
  13.                         this.customerStatusValueArray.map((nextCustomerStatusValue, index) => {
  14.                             if (nextCustomerStatusValue.key == this.customerRow.status) {
  15.                                 this.selection_status = {key: this.customerRow.status, label: nextCustomerStatusValue.label};
  16.                             }
  17.                         });
  18.  
  19.                         this.is_page_loaded = true
  20.                     })
  21.                     .catch((error) => {
  22.                         console.error(error)
  23.                         this.showPopupMessage("Customers", 'Error loading customer !', 'warn' );
  24.                     });
  25.  
  26.             }, // loadCustomer() {
  27.  

Или :

CODE (javascript):
скопировать код в буфер обмена
  1.         mounted() {
  2.             retrieveAppDictionaries(['hostelFeatureValueArray', 'hostelStatusValueArray', 'hostelInqueriesStatusValueArray']);
  3.             bus.$on('appDictionariesRetrieved', (data) => {
  4.                 this.hostelFeatureValueArray = data.hostelFeatureValueArray
  5.                 this.hostelStatusValueArray = data.hostelStatusValueArray
  6.                 ...
  7.             })
  8.  

где retrieveAppDictionaries - общая функция с различным набором параметров и возвращаемых данных из axois- запроса

С Promise ранее не сталкивался и разбираясь с vuex-примерами нашел реализацию логина вроде :

В файле resources/js/helpers/authFuncs.js:

CODE (javascript):
скопировать код в буфер обмена
  1. export function login(credentials) {
  2.     return new Promise((res, rej) => {
  3.         axios.post('/api/auth/login', credentials)
  4.             .then((response) => {
  5.                 setAuthorizationToken(response.data.access_token);
  6.                 res(response.data);
  7.             })
  8.             .catch((err) =>{
  9.                 rej("Wrong email or password");
  10.             })
  11.     })
  12. }
  13.  

В файле Login.vue :
CODE (javascript):
скопировать код в буфер обмена
  1.         methods: {
  2.             authenticate() {
  3.                 this.$store.dispatch('login');    // calling action
  4.                 login(this.$data.form)
  5.                     .then((res) => {
  6.                         this.$store.commit("setLoginSuccess", res);  // calling mutation
  7.                         this.$store.dispatch('retrieveHostelBookmarks', res.user.id);
  8.                         this.$store.dispatch('retrievePersonalOptions', res.user.id);
  9.                         this.$router.push({path: '/personal'}); // For debugging!
  10.                     })
  11.                     .catch((error) => {
  12.                         this.$store.commit("setLoginFailed", {error});   // calling mutation
  13.  
  14.                     });
  15.             }
  16.         },  // methods: {
  17.  
  18.  
1) Есть ли смысл / польза от использования Promise в первых 2х моих примерах и если да то как ?
2) Что означают строки :
CODE (javascript):
скопировать код в буфер обмена
  1.       res(response.data);
  2.  
и
CODE (javascript):
скопировать код в буфер обмена
  1.                 rej("Wrong email or password");
  2.  
?
6. armancho7777777 - 02 Ноября, 2019 - 13:34:01 - перейти к сообщению
mstdmstd пишет:
1) Есть ли смысл / польза от использования Promise в первых 2х моих примерах и если да то как ?

Нет.

mstdmstd пишет:
2) Что означают строки

Я же написал выше
armancho7777777 пишет:
Переопределение возвращаемых значений


В функции обратного вызова then попадает одно значение, а посредством собственной Promise-обёртки происходит переопределение этих значений.

CODE (javascript):
скопировать код в буфер обмена
  1. const axios = {
  2.   post: (url) => new Promise((resolve, reject) => {
  3.     resolve({data: {foo: 'bar'}});
  4.   })
  5. };
  6.  
  7. axios.post('...').then((resp) => {
  8.   console.log(resp); // {data: {foo: 'bar'}}
  9. });
  10.  
  11. const myRequest = new Promise(resolve => {
  12.   axios.post('...').then((resp) => {
  13.     resolve(resp.data);
  14.   });
  15. });
  16.  
  17. myRequest.then(resp => {
  18.   console.log(resp); // {foo: 'bar'}
  19. });
7. LIME - 02 Ноября, 2019 - 13:41:25 - перейти к сообщению
armancho7777777что делает resolve? И почему это надо спрашивать?
(Добавление)
Кучу букв от тс даже не пытался читать.
Чтобы ему забросить код на пару недель и потом самому читать
8. armancho7777777 - 02 Ноября, 2019 - 14:02:12 - перейти к сообщению
LIME пишет:
что делает resolve?

Ах да.
resolve - предназначена для обработки успешного результата, reject-же, следовательно, для ошибок.
9. LIME - 02 Ноября, 2019 - 14:12:02 - перейти к сообщению
Ах да)) снова этот тупица))
Делаем щастье внутри короче))
Надо было так и назвать а то похоже на что-то нативное
Чуть не начал гуглить)
Именование плин...
(Добавление)
Не все асинхрон юзают чтоб от зубов...
Не все
10. armancho7777777 - 02 Ноября, 2019 - 14:18:57 - перейти к сообщению
А, ну да.
Это функции, которые должны выполниться при успешном и нет случае.
(Добавление)
Тут, кстати, достаточно доходчиво "расжёвано".
11. LIME - 02 Ноября, 2019 - 14:52:04 - перейти к сообщению
armancho7777777 я чуть о другом
Надо так нэйминги научиться выбирать чтоб не оставалось вопросов
Всякие resolve и тп хороши только в доках и мануалах
Называем по действию
Не "как" а "что"
doPayload- нет, makeSomeThing - да
(Добавление)
Это на самом деле очень тонкий момент
Приходит с большим опытом
Надо достаточно начитаться всяких regenerateName итп
)))

 

Powered by ExBB FM 1.0 RC1