React On Rails и Redux теряют Persist Store после смены страницы - PullRequest
Новая
       28

React On Rails и Redux теряют Persist Store после смены страницы

0 голосов
/ 19 марта 2019

Я пытаюсь создать простое приложение с Ruby on Rails и React.Я использую драгоценный камень Reaction_on_rails .Кроме того, я пытаюсь использовать Redux для связи между различными компонентами, когда мне нужно.Вопрос, который у меня возник на текущий момент, я не понимаю, как держать Store в приложении.Если это простое приложение React, у меня нет проблем, чтобы разделить Redux между компонентами.В React On Rails есть другой способ его настройки, и он отлично работает при текущей реализации, но я теряю магазин, когда переключаюсь на другую страницу или обновляю страницу.

Моя цель - добавить продуктИдентификатор в корзину через Redux и их, когда пользователь перенаправляет на страницу /cart, он может получить массив корзины из магазина Redux, а затем я могу заполнить страницу необходимыми продуктами.

Пример компонента простого представления в Rails. 

<div class='fancyClass'>
  <%= react_component("ProductDetail", props: {product: @product.id}) %>
</div>

Пример простого компонента реакции, который добавляет продукт в массив корзины 

// @flow

import * as React from 'react';
import { Provider, connect } from 'react-redux';
import { setCart } from 'action/SetCart';
import { createStore } from 'redux';
import rootReducer from '../reducers';

const store = createStore(rootReducer);

type Props = {
    product: number
}

export class Scratch1 extends React.Component<Props> {
    onClick = () => {
        this.props.setCart(this.props.product);
        window.location.assign('/cart')
    };

    render() {
        return (
            <Provider store={store}>
                <button onClick={this.onClick}>add to cart</button>
            </Provider>
        );
    }
}

const Scratch1Redux = connect(
    state => ({
        cart: state.cart,
    }),
    dispatch => ({
        setCart: id => {
            dispatch(setCart(id))
        }
    })
)(Scratch1);

export default Scratch1Redux;

Заранее спасибо

1 Ответ

0 голосов
/ 19 марта 2019

Вы не понимаете, как работает React + Rails.Rails обслуживает ресурсы: HTML, JS + React, CSS.Каждый раз, когда вы отправляете новый запрос на новый маршрут, технически отправляется React вместе со всеми вашими компонентами, и монтируется новый магазин.Если вы хотите, чтобы ваш магазин сохранялся, вы должны разрешить своему приложению работать как одностраничное приложение (SPA).

Если вы хотите, чтобы ваша Корзина сохранялась, попробуйте создать объект Корзина в вашей базе данных и дать пользователю корзину.Таким образом, это будет продолжаться бесконечно.Вы можете передать данные своей корзины пользователю через объект JSON в теге данных HTML или запрос API JSON в React (предпочтительно)

Ваш вопрос в основном имеет дело с этим: Это похоже на дубликат https://stackoverflow.com/a/3433048/8844929

...