Как обновить данные корзины покупок во всех вкладках браузера - PullRequest
Новая
       10

Как обновить данные корзины покупок во всех вкладках браузера

0 голосов
/ 14 января 2019

Мне нужно обновить все данные в javascript классе корзины. Я работаю с localStorage

У меня есть класс javascript, который управляет корзиной, и когда пользователь нажимает на кнопку добавления товаров. Сохраняет данные в localStorage, а класс Cart обновляет данные с помощью localStorage

Класс корзины 

class Cart{
    constructor(){
        this._token = 'fafacart_items';

        this._items = null;


        this._orderId = null;

        this._shipping = {
            id: null,
            city: null,
            type: 'post',
            name: '',
            mobile: '',
            email: '',
            address: '',
            postcode: '',
            national_code: ''
        };

        this._coupon = {
            active: false
        };

        this._paymentMethod = 'online';

        this._validation = null;

        // this.restore();

        window.addEventListener('storage', this.restore())
    }

 restore(){
        var stored = Storage.getItem(this._token);
        console.log(stored)
        if(stored){
            this._items = stored.items;
            this._shipping = Object.assign({}, this._shipping,   stored.shipping);
            this._coupon = Object.assign({}, this._coupon, stored.coupon);
            this._paymentMethod = stored.paymentMethod;
            this._validation = stored.validation;
            this.orderId = stored.orderId;
        } else {
            this._items = [];
        }

        if(this._items.length == 0)
            this.valid = true;
    }


}

CartHolder является компонентом реакции Я просто импортирую класс Cart и setState, как показано ниже 

export default class CartHolder extends Component {
    constructor(props) {
        super(props);

        this.state = {
            cart: null
        };

        this.restore = this.restore.bind(this);
    }

    componentWillMount(){
        if(this.props.paid){
            Cart.empty();
        }

        this.listen('add-to-cart', product => {
            Cart.add(product);

            this.restore();
        });

        this.restore();
    }

    restore(){
        this.setState({cart: Cart});
    }
}

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

1 Ответ

0 голосов
/ 14 января 2019

Поскольку вкладки браузера находятся на стороне клиента, единственный возможный способ сделать это - обновить все вкладки браузера для загрузки самых последних / актуальных данных.

Для этого вы можете использовать JS: 

browser.tabs.reload();

Однако обратите внимание, что это новая функция JS, и в настоящее время она поддерживается не всеми браузерами. Смотрите совместимость здесь .

...