Доброй ночи, делаю карусель товаров, в которую пользователь может добавлять свои товары, как избранные, работает добавление через redux, код верный я 100 раз проверял, что все данные приходят/удаляются и все с ними нормально, но проблема именно с owl каруселью, я нажимаю, к примеру, добавить товар, он не добавляет, хотя все в redux ок, после к примеру добавляю еще один, после чего добавится тот, что я добавлял ранее, по сути данные опаздывают на один action.
Кто-то сталкивался с этой проблемой? Код карусели:
import React from 'react';
import {connect} from 'react-redux';
import './FavoriteTovar.css';
import OwlCarousel from 'react-owl-carousel';
import 'owl.carousel/dist/assets/owl.carousel.css';
import 'owl.carousel/dist/assets/owl.theme.default.css';
import FavoriteItem from './FavoriteItem/FavoriteItem.jsx'
const FavoriteGames = ({isAuth, favoriteTovar}) => {
const options = {
margin: 35,
nav: true,
navText: ['<div class="main__arrow--prev main__arrow"><svg class="arrow main__like--slider--arrow--prev--icon" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 477.175 477.175" xmlSpace="preserve"><g><path d="M145.188,238.575l215.5-215.5c5.3-5.3,5.3-13.8,0-19.1s-13.8-5.3-19.1,0l-225.1,225.1c-5.3,5.3-5.3,13.8,0,19.1l225.1,225 c2.6,2.6,6.1,4,9.5,4s6.9-1.3,9.5-4c5.3-5.3,5.3-13.8,0-19.1L145.188,238.575z" /></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g></svg></div>', '<div class="main__arrow--next main__arrow"><svg class="arrow main__like--slider--arrow--next--icon" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 477.175 477.175" xmlSpace="preserve"><g><path d="M360.731,229.075l-225.1-225.1c-5.3-5.3-13.8-5.3-19.1,0s-5.3,13.8,0,19.1l215.5,215.5l-215.5,215.5 c-5.3,5.3-5.3,13.8,0,19.1c2.6,2.6,6.1,4,9.5,4c3.4,0,6.9-1.3,9.5-4l225.1-225.1C365.931,242.875,365.931,234.275,360.731,229.075z" /></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g></svg></div>'],
responsiveClass: true,
responsive:{
0:{
items:1
},
800:{
items:2
},
1745:{
items:3,
}
}
}
return(
<div className="main__like--tovar--inner">
{isAuth
&& <div className="main__like--tovar--slider">
<OwlCarousel {...options} className="main__like--tovar--carousel">
{favoriteTovar.map((name, id) => <FavoriteItem key={`${id}_${name}`} tovarName={name} />)}
</OwlCarousel>
</div>
)
}
Простой
