Category "reactjs"

React Native map with Google API, Search bar is not compactable with screen width

This is the code for React Native Map using Google Map's API. import React, { useEffect, useState } from 'react'; import { PermissionsAndroid, StyleSheet, View,

Couldn't work hooks for fetching API in Nexr JS + Open Weather API

I would like to use the Open Weather API to get monthly temperature data for each City. I am using Hooks to get temperature data but I am getting an Object erro

Not able to send files data from front-end (react.js) to back-end (node)

I have an application that stores to its state files' content, whether images, audio or both, as shown here with the mediaAudio object key: In my react.js code

MUI Radio button disabled change value when Select drop down changes

My problem is that when I change a value in a dropdown I want to disable two radio buttons and change to the correct radio button. I am able to disable the radi

Why do “specific” component renders a more “generic” one?

This is straight from reactjs site. function Dialog(props) { return ( <FancyBorder color="blue"> <h1 className="Dialog-title"> {

Conditionally render a React component depending on a descendant's render

We use Reakit dialogs to prompt users to take an action in our React web app. On some pages, we have specific text related to the action and would like to rende

Trying to loop through firebase and display each object as a card React

My data is structured like so [1]: https://i.stack.imgur.com/dWsr3.png I am trying to loop through the database and put the data from each card into props for m

Next.js Navbar gives a warning of Target Element not found when clicked

I am currently working on a next.js app, which contains a connect wallet button found to the right of the navbar, with the navigation links to the left of the n

How do I style a component that has `styled-components` nested in it?

I am new to styled-components. I'm trying to set styles for MyComponent to apply to styled-component. export const Relative = styled.div` position: relative;

Is there a way to override what useMemo does to determine if there's a change?

useMemo(() => expensiveFunction(), [deps]) re-executes the expensiveFunction when the deps have changed. I was wondering... is there a way to control how Re

React & CSS: How to override :root in css module in React?

Short question. I'm trying to build a theme selector for an app and was wondering how to change the :root of a css module in a press of a button in jsx.

How to pre-download items from a JSON list array in React JS?

Here the Codesandbox example. I have a list array of songs: const tracks = [ { name: "Sunny", src: "https://www.bensound.com/bensound-music/

What are my options to deal with this stale closure in React besides using ref

I'm using the library React Datasheet Grid, the main component has a property called OnActiveCellChange, to which i'm passing my custom function: const [selecte

How to custom search bars in Ant Design ProTable

Currently, I am using table of antd ProTable. I want to divide a column into two smaller ones, and each should has its equivalent search bar. However, it only s

How is the video stream still making it to the peerConnection although I disabled it?

I'm working on a peer to peer webrtc project using react, hooks, and redux. When I make modifications such as disabling the video, I don't see it on the local v

How to add random minutes like first slots should be 30 minutes and then 1 of 15 minute slot and again 30 minute slot

const eventClick = (args) => { let StartTime = moment(args?.event?.StartTime, 'HH:mm ') let EndTime = moment(args?.event?.EndTime, 'HH:mm ') if (

How to make Categories button functional

I got my current website displaying hard coded data from my data.js file. I implemented firebase as my database and I want to have my categories button work wit

Insert tab character into SlateJS text editor

How to insert tab characters into SlateJS? So inserting &emsp; is a tab character, however, when inserting this as text, it appears as the literal character

React / Rails / I18next change language in URL or refresh server-side props

I'm using React with Rails. I get some props from a React controller when rendering the page initially. When changing the language on the frontend (I18next), we

How to pass const value from one react js file to another?

I am a little new on react. How can I pass a variable with its value from one react js file to another? File A.js: const [value, setValue] = useState(35) Fil