I have a react app that Takes an array of GIF urls Renders the first one of the array Allows the user to click on "Next/Back" to navigate through the array and render the Next/Previous GIF. Under the hood, when…
I'm feeling stupid cause i did the entire site but I'm stuck trying to make the navlinks scroll in the components of the same page. My App.js import Header from './components/Header'; import Intro from './components/Intro'; import Experience from './components/Experience'; import…
Very simple case, but I can't find the way out! I have a Google map with a single marker. The "click" listener callback function logs the state's value. I added a button that changes the state's value, and a useEffect…
Index.js import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; const root = ReactDOM.createRoot(document.getElementById('App')); root.render( <React.StrictMode> <App /> </React.StrictMode> ); App.js import './App.css' import Release from './components/Release' import { BrowserRouter as Router, Routes, Route, NavLink,…
I was expecting just 10 pictures on initial load, but ended up getting 20 because of the functional update of the state. Result: if in use the normal approach the app will show the expected 10,i want to add if…
My react-hook-form is not working when onSubmit is called. Here is where my problem comes from I assume: const onSubmit = (data) =>{ console.log(data); alert("Reserve Successful") reset() } return ( <div className={styles.Reserve} id="form"> <form onSubmit={handleSubmit(onSubmit)}> The full code: import styles…
For example! I need to create 3 radio buttons, if i click on 1-4, i will need to see the workouts that has 1 to 4 Weeks, if i click on 5-9 i need to see the workouts that has…
I am trying to create a condition statement for the url that the user would click, what i want to do is this, check if the message.sender.id === user_id, then i want to change the url to ${/inbox/}${message.reciever.id}${"/"} and if…
I can pass a styled-component(Text component) like export const Text = styled.span` font-size: 16px; color: red; `; Text.displayName = 'Text'; const Parent = () => { return ( <> <Child Text={Text} /> </> ); }; but now like this <Child…
I need to make a custom component in stencil where the color is dynamic. Any way to take the value of variable from tsx and access it on scss file. The code is below. https://stackblitz.com/edit/stenicil-starter-component-oeyzhz?file=src%2Fcomponents%2Fmy-component%2Fmy-component.tsx&file=src%2Fcomponents%2Fmy-component%2Fmy-component.css