Category "reactjs"

Two classes on single react HTML element

I feel like there is a simple answer here, but I'm not finding it - In my react header I import my stylesheet under 'styles' and as such refers to css classes a

React get value of object from localstorge

I get data from localstorage. I used useEffect. But when I want to get a value in object, I got problem. const [carinfo, setCarInfo] = useState(); useEffect((

MediaSource never emit sourceopen event in React

I'm trying to stream a video file using Javascript's MediaSource API in a React custom hook. Here's the snippet of my code: const useMyHook = (videoRef: React.M

useQueries how to get response for a certain query

Is it possible to distinguish the response, we get from useQueries. For example const ids = ['dg1', 'pt3', 'bn5']; const data = useQueries( ids.map(id => (

Importing React as default module not working inside Symfony Webpack Encore project

I have a Symfony project, where the frontend-pipeline is built with Webpack Encore, I would like to add React to the project and have a React widget inserted in

Custom place of filter input in react-bootstrap-table

I'm using react-bootstrap-table and I want to place the input filter of table columns in top of the table not on top/bottom on the column (default behavior). I

Multiple locales with date-fns in ReactJs

Using date-fns, i am trying to add multiple locales in my app, before i hade one only locale so the import was simply like this : import {fr as locale} from 'da

link login page to homepage using react

I am trying to display first the log in page and then it goes to the home page but it does not work. Can Anyone figure out the problem? How Can I direct my logi

Get ETH Balance with Ethersjs

I'm trying to get the balance of my wallet address to render on my frontend. Here's what I have so far. const [balance, setBalance] = useState(""); const hand

using webpack to import files dynamically inside react component

const LongDetail: React.FC<Props> = ({ id, section, placeholder, Fromtolocation, }) => { const { setPrimary, setSecondary, create

Preserving prior form data when navigating back in Gatsbyjs

I have search page in Gatsbyjs where a filter form resides in the sidebar with multiple options. The page is generated from node.js using a template, where the

How to independently set a button click in react?

I am trying to figure out on how to set a button that can independently be disabled when using the .map function. So I created a state whenever the button is cl

Firebase deploy issue

I am learning web development. At now I'm practicing some react projects with firebase authentication. But after finishing the deployment, I'm only getting this

app.post('\pageNameOrCanBeAnyRandomName')?

I have a page called createEmployee.js which includes 2 functions (fetchData and createNewEmployee) ... see below: const fetchData = async() => { c

Playing background music in a React app using Howler

So im using Howler to play background music when my React app is loaded. So I store ID of the instance of Howler(i.e is responsible for background music) using

Create Infinite Scroll with react typescript

How do I create a infinite scroll that detects when we reach the bottom of the page but with typescript

How to run npm start without opening browser for react development on linux

I am learning react and find myself running npm start on the terminal a couple of times but its annoying how it opens a new browser window everytime. I'm tryin

React - prevent calling useEffect for the first mount [duplicate]

I want to prevent calling my useEffect on the first mount. how can I do this? I want the best practice. I don't want to use if condition impor

`react-query` mutate onSuccess function not responding

query, I'm making a bulletin board right now. So, I put the values ​​of title, content in the Form information into the react-query function onSucce

Get scroll position with NextJS

I want to know if the user has scrolled or not to update the UI in NextJS. I have the following code, all the examples I have found have the same code: const