Answer the question
In order to leave comments, you need to log in
Owl carousel react data update not happening immediately?
Good night, I'm making a product carousel, in which the user can add their products as favorites, adding via redux works, the code is correct, I checked 100 times that all data is received / deleted and everything is fine with them, but the problem is with the owl carousel, I I click, for example, add a product, it does not add, although everything in redux is ok, then for example I add another one, after which the one that I added earlier will be added, in fact the data is late for one action.
Someone faced this problem? Carousel code:
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>
)
}
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question