Carousel position resets when parent component's timer interval is triggered
See original GitHub issueI have a <Carousel>
instance that is embedded in a parent component’s render
method.
render() {
return (
<div>
<Carousel>
...
</Carousel>
</div>
)
}
The parent component’s componentDidMount()
method contains a setInterval()
call that runs every five seconds (for example).
componentDidMount() {
this.myRefreshInterval = setInterval(() => { ... }, 5000)
}
The carousel’s selectedItem
property is reset to zero every five seconds, when the parent component’s myRefreshInterval
interval is triggered.
Issue Analytics
- State:
- Created 5 years ago
- Reactions:2
- Comments:6
Top Results From Across the Web
Resetting interval timer for carousel [duplicate] - Stack Overflow
This is a simple this.currentAlbum = selectedValue (selectedValue being received from the HTML click). However, when doing this, the timer ...
Read more >Options - Splide
Learn how to customize the carousel by available options. ... Converts the image src to the css background-image URL of the parent element....
Read more >setInterval() - Web APIs - MDN Web Docs
This method returns an interval ID which uniquely identifies the interval, so you can remove it later by calling clearInterval() . Syntax.
Read more >Overlays | React-Bootstrap
A set of components for positioning beautiful overlays, tooltips, popovers, and anything else you need. Overview#. Things to know about the React-Bootstrap ...
Read more >How to Create an Animated Countdown Timer With HTML ...
To visualize time passing, we need to add a second layer to our ring that handles the animation. What we're doing is essentially...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Was able to get this working, thanks for the suggestion spamforhope! For anyone trying to control carousel position in parent state here’s what I used:
Carousel:
Parent Component:
@tenacious-joy I’ve created logic where I store current slide Index and set it to Carousel activeSlide props every time. It works, but it’s not a solution.