Асинхронный запрос

@Kraken73 · Регистрация: 17.09.2015

Студворк — интернет-сервис помощи студентам

Запрашиваю данные с БД, потом экспортирую, и когда испортирую в другой файл, то приходит promise. Как сделать, чтобы не promise приходил, а данные?

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
const elementsData = () => {
  const dataDb = db.ref().child('elements'); // с БД работа
  let data;
  const getData = () => {
    const promise = new Promise((resolve) => {
      dataDb.once('value', (snap) => {
        data = snap.val();
        resolve(data);
      }); // тут вытягиваю данные с БД
    });
    return promise;
  };
 
  return getData().then((dataCallback) => {
    const blabla = (state = dataCallback, action) => {
        // тут провожу махинации co state
      return state;
    };
    return blabla;
  });
};
 
export default async function () {
  const data = await elementsData();
  return data;
}

JavaScript
1
import elementsData from './file';

@Evgen1337 · 03.08.2018, 16:08

JavaScript
1
2
3
4
5
componentDidMount() {
 roomsDate.then(data => {
  this.setState(data)
 })
}

@Kraken73 · 06.08.2018, 08:15 **[ТС]**

Evgen1337,
Не совсем понял(ну или я не дописал)
2-ой файл(объединяю редьюсеры)

JavaScript
1
2
3
4
5
6
7
8
import { combineReducers } from 'redux';
import elementsData from './file';
 
const allReducers = combineReducers({
  elements: elementsDate,
});
 
export default allReducers;

3-файл. Записываю все это в store. И потом с props эти данные тяну.

JavaScript
1
2
3
4
import allReducers from './reducers';
const store = createStore(
  allReducers
);

можно поподробней объяснить?)

@Evgen1337 · 06.08.2018, 12:35

для асинхронных функций (промис) в redux, нужно использовать redux-thunk https://github.com/reduxjs/redux-thunk

подробней объяснить пытаться можно, но неизвестно, что-то не понятно )

Добавлено через 2 минуты
https://redux.js.org/advanced/... n-creators

@Kraken73 · 07.08.2018, 09:51 **[ТС]**

Evgen1337,
сделал через redux-thunk, но срабатывает со 2-ого раза(сделал пока на клик)
action

JavaScript
1
2
3
4
5
6
7
8
const GET_DATA = 'GET_DATA';
 
export const getData = text => (
  {
    type: GET_DATA,
    payload: text,
  }
);

reducer

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
const initialState = [];
 
const rooms = (state = initialState, action) => {
  switch (action.type) {
    case 'GET_DATA': {
      const thisDb = db.ref().child('data');
      let stateNew = state;
      thisDb.on('value', (snap) => {
        stateNew = snap.val();
        return stateNew;
      });
      return stateNew;
    }
  ...

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
  ...
  getDataHandler= () => {
    const { props } = this;
    props.getData();
  }
  ...
  <button type="button" onClick={this.getDataHandler}>
      Получить данные
  </button>
  ...
const mapStateToProps = ({ data }) => ({
  data ,
});
 
const mapDispatchToProps = dispatch => ({
  getData: () => dispatch(getData()),
});
 
export default connect(mapStateToProps, mapDispatchToProps)(infoList);

ну и store

JavaScript
1
2
3
4
const store = createStore(
  allReducers,
  composeWithDevTools(applyMiddleware(thunk)),
);

@Evgen1337 · 07.08.2018, 15:26

Сообщение от ******73

JavaScript
1
2
3
4
5
6
7
8
9
case 'GET_DATA': {
* * * const thisDb = db.ref().child('data');
* * * let stateNew = state;
* * * thisDb.on('value', (snap) => {
* * * * stateNew = snap.val();
* * * * return stateNew;
* * * });
* * * return stateNew;
* * }

А почему здесь два раза ретурн?

@Kraken73 · 08.08.2018, 10:05 **[ТС]**

Сообщение от Evgen1337

А почему здесь два раза ретурн?

Который в скобках вторым обрабатывается и должен данные вернуть, вне скобок он раньше возвращает, чем данные приходят

@Evgen1337 · 08.08.2018, 10:45

Redux Thunk middleware allows you to write action creators that return a function instead of an action. The thunk can be used to delay the dispatch of an action, or to dispatch only if a certain condition is met. The inner function receives the store methods dispatch and getState as parameters.

An action creator that returns a function to perform asynchronous dispatch:

Редакс Танк позволяет возвращать ф-цию. Это можно использовать для задержки вызова dispatch, или вызвать dispatch при определенных условиях. Функция получает два метода dispatch и getState как параметры.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
const INCREMENT_COUNTER = 'INCREMENT_COUNTER';
 
function increment() {
  return {
    type: INCREMENT_COUNTER
  };
}
 
function incrementAsync() {
  return dispatch => { // здесь можно написать return (dispatch, getState) => {
    setTimeout(() => {
      // Yay! Can invoke sync or async actions with `dispatch`
      // Да да! Можно вызвать синхронно или асинхронно через dispatch
      dispatch(increment());
    }, 1000);
  };
}

Новые блоги и статьи Все статьи Все блоги /
Символьное дифференцирование igorrr37 13.02.2026 / * Логарифм записывается как: (x-2)log(x^2+2) - означает логарифм (x^2+2) по основанию (x-2). Унарный минус обозначается как ! */ #include <iostream> #include <stack> #include <cctype>. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .	И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .	Установка Qt-версии Lazarus IDE в Debian Trixie Xfce volvo 10.02.2026 В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .

@Evgen1337 249 / 162 / 68 Регистрация: 10.12.2017 Сообщений: 558
	06.08.2018, 12:35
	для асинхронных функций (промис) в redux, нужно использовать redux-thunk https://github.com/reduxjs/redux-thunk подробней объяснить пытаться можно, но неизвестно, что-то не понятно ) Добавлено через 2 минуты https://redux.js.org/advanced/... n-creators 0

Асинхронный запрос

Решение