Ответы пользователя по тегу Redux
  • Как протестировать Redux saga с помощью jest?

    const gen = mySaga();
    const eff = gen.next().value;
    expect(eff).toEqual(
      all([
        takeLatest(Types.FETCH_INFO_DISK_REQUEST, fetchDisk),
        takeLatest(Types.FETCH_RESOURCES_REQUEST, fetchResources),
        // ...
      ]),
    );


    Проверяете что это прослушивается, отдельные саги тестируете по-отдельности
    Ответ написан
  • Как отменить асинхронное выполнение кода на JS?

    Просто добавь await перед axios.get или оберни invoices в Promise.all
    await Promise.all(
        invoices.map(invoice =>
          axios('url', invoice).then(data => {
            dispatch({ type: 'PI_SET_INVOICES_PARAMS', payload: data.Model });
          }),
        ),
      );
    Ответ написан
    Комментировать
  • Как отправить пустую строку вместо undefined, redux-form?

    Например так:
    handleSubmit = (values) => {
    	values = {...values, someField : values.someField !== undefined ? values.someField : ""};
    	return updateById(this.props.user.id, values)
    		.then(res => {
    			if (res.error)
    				throw new SubmissionError({_error:res.error,...res.errors});
    
    			return res;
    		});
    }


    Или сделать так:
    initialValues={{
    	someField : ""
    }}


    Но вообще у тебя странное поведение, потому что redux-form отправляет null в случае если значение отсутствует. И логично было бы проверять это на сервере.
    Ответ написан
  • Вопрос от новичка по React?

    redux нужен для глобальных данных, общего состояния приложения (корзина товаров вполне подходит), для всего остального есть мас.. локальный стейт.
    --
    без него можно обойтись в твоем примере, если заврапить все компоненты которым нужна корзина в контейнер и передавать пропом во все ветки внутренних компонентов, как ты уже понял это стремно, не красиво и есть грабли вроде таких, что нам так же придется кидать в пропы и обработчики событий с общего контейнера.
    Ответ написан
    2 комментария
  • Полноценный пример SSR для react/redux?

    Да состояние собирается на сервере для каждого клиента (request'a), скажем на уровне мидлвара мы собираем состояние (текущего авторизованного пользователя, какие-то другие глобальные данные), далее отрабатывает обработчик маршрута, мы получили данные какой-то страницы из бд и передали их как контекст, примерно так:
    import React from 'react';
    import { StaticRouter } from 'react-router'
    import { Provider } from 'react-redux'
    import ReactDOMServer from 'react-dom/server';
    
    import App from './client/components/App.jsx'
    
    ReactDOMServer.renderToString(
    	<Provider store={ReduxStore}>
    		<StaticRouter
    			location={Url}
    			context={Context}>
    			<App/>
    		</StaticRouter>
    	</Provider>
    );

    Где, ReduxStore сгенерированное нами глобальное состояние (redux) запроса, Url запрошенный урл, Context контекст (будет передано как this.props.staticContext в компонент). Реакт вытянет нужный контейнер роута (по вашим маршрутам в App) и передаст ему контекст, компонент рендерится исходя из полученных данных. Результатом работы метода renderToString будет html строка (размеченная реактом), которую мы шаблонизатором или как угодно впиливаем в блок моунта компонента (в верстке), дополнительно в шаблонизатор передаем сгенерированное состояние, в документации выглядит вот так:
    window.__PRELOADED_STATE__ = JSON.stringify(preloadedState || {}).replace(/</g, '\\u003c')

    Теперь что происходит после того как страница загрузилась и подхватились клиент-скрипты? Все просто мы подхватываем состояние из window.__PRELOADED_STATE__ и вообщем-то все, глобальное состояние передано, компонент уже отрендерен, стоит учитывать что результаты при клиент-рендере и при сервер-рендере должны быть всегда одинаковыми, так же не использовать методы доступные браузеру, но не доступные серверу (на уровне моунта и первого рендера) и хорошенько следить за своим кодом в плане памяти, иначе при какой-либо утечке, память на сервере не будет вычищаться после каждого рендера.
    ---
    Как-то так, надеюсь помог, хотя там еще довольно много заковык
    Ответ написан
    20 комментариев
  • Коммуникация с сервером каждые N секунд, react/redux?

    webSocket и пусть сервер сам сообщает если данные изменились
    Ответ написан
    4 комментария
  • Где можно посмотреть пример кода компонента React взаимодействующий с API?

    Фиг знает какие сейчас "правила", все слишком часто меняется, но когда я смотрел эту тему в последний раз было что-то в духе умных контейнеров и глупых компонентов, контейнеры общаются с api, изменяют состояние редакса, локальное состояние, на основе этого состояние работают глупые компоненты. Но на самом деле ты можешь общаться с API как и где тебе угодно и со временем ты скорее всего сам столкнешься с определенными проблемами, дублирование кода или что-то такое и поймешь как это исправить (сам), поймешь что нужно гуглить, изучая тему не нужно сразу пытаться сделать идеал, тем более это понятие разное для каждого.
    Ответ написан
    1 комментарий