react-native-blink-view
react-native-blink-view copied to clipboard
Question - On usage of blinking prop and useEffect
I'm missing something simple - I've got a timer and thats updated by a useEffect hook. I'd to render a countdown timer that flashes after the minutes are at a certain level i cannot get it to update and blink after the component has been rendered, any idea whats off?
here's my timer:
`const [minutes, setMinutes] = useState(remaining_minutes);
function updateTime() { if (minutes == 1) { setMinutes(0); endSession(); } else { setMinutes((minutes) => minutes - 1); } console.log("mins:", minutes); }
useEffect(() => { const token = setTimeout(updateTime, 60000); return function cleanUp() { clearTimeout(token); }; });`
here's the BlinkView component
{joined && minutes < 45 && ( <BlinkView delayVisible={750} delayInvisible={0} duration={500} blinking={minutes <= 2 ? true : false} element={Text} > <Text style={{ fontFamily: "Montserrat-Bold", color: "#fff", paddingBottom: 5, }} > Remaining minutes:{" "} <Text style={{ fontFamily: "Montserrat-Bold", color: minutes > 2 ? "#fff" : "red", }} > {minutes}{" "} </Text> </Text> </BlinkView> )}
The color in the Text changes when minutes is <=2 but the component blinking doesn't toggle. Any in-site on what I'm missing?