Given this minimal example: import React, { useState } from ‘react’; function Component({ num }) { const [lorem, setLorem] = useState(‘lorem’); return ( <div> {num}: {lorem} </div> ); } function AnotherComponent({ render = Component }) { const [isOpen, setIsOpen] = useState(false); return ( <div> <button type="button" onClick={() => setIsOpen(true)}> Open </button> {isOpen ? render({ num:… Read More React – Using render props with conditional components causes hooks error

I am trying to make an app where you can click on an anchor point on a page, then click on an image in a side div and change the anchor point’s image src to be that of the new image clicked. I have an array of image SRC’s that I map through, however when… Read More Why Isn't may Array of image SRC's are not updating with UseState

I have used hooks in index.js to fetch data from an API. The data is displayed in rows and every row has a button with onClick={() => EditExercise(item.idexercise)}. EditExercise is a function in a .jsx file that receives the id and fetches a single item from the same API. function EditExercise(id){ const [error, setError] =… Read More How can I fetch data from API using an ID passed to a function when clicking a button

I’m trying to show a table in my react component, but i don’t know how to use useEffect and useState to render table in first render. My component js: import React, { useEffect, useState } from ‘react’ const Projects = () => { const [tableData, setTableData] = React.useState() useEffect(() => { fetch(‘https://script.google.com/macros/s/AKfycbzuKuSOUfd9IOsQobix0PnIRv28IB3uTx5KdpVoVeNe04g7QzXQeeCEbsHBxE5CYdEV8A/exec&#8217;) //получение информации из… Read More How to rerender component, using useEffect and useState?

How can I make regex pattern allowing following characters, numbers, white space, double quotes, ?, !, commas, hyphen, dots, @ and & <textarea id="comments" type="textarea" placeholder=’comments’ {…register("comments", { required: true, minLength: { value: 5, message: "Minimum length of 5 letters" }, pattern: { value: /^[a-z0-9]+$/i, message: "Supports characters, numbers, white space, "", ?, !, @,… Read More How can I make regex pattern with characters, numbers, white space, double quotes, ?, !, commas, hyphen, dots, @ and &

I have two arrays(word and translatedWord). They contain words(word array contains words in english and translatedWord contains the same words but in another language ). I want to create an array of objects, each object to have the properties value, translation and id. I solved how I can create an object with the translatedWord properties,… Read More How can I pass array values to a property of Object?

I am new to react and I am using react-hook-form useFormContextand it is generating the following error, Argument of type ‘string | undefined’ is not assignable to parameter of type ‘string’. Type ‘undefined’ is not assignable to type ‘string’. and I am not sure why. My code is the following, const mapFields = new Map([[‘d1’,… Read More React hook form useFormContext generating "argument of type 'string | undefined'" error

I was trying to achieve something like this in react e.g. user enter his/her age and when click the button following logic should work if age>18 then Eligible for Passport else Not eligible But I am getting no output when I enter the age and click the Enter button. import { useState } from "react";… Read More Why if-else is not working in this react code, cause I am not getting output?

I have student data. I want to filter and display names and IDs based on date. I can select the date but once I choose a date the dropdown menu shows only that particular date, not the other dates. I want to see all the dates whenever I click the input field. Could you please… Read More Couldn't able to see all the options in the drop-down menu after selecting one in React

Trying to edit the blog data based on blog id, but I am not able to get the blog data. I would like to display the data in the input name columns heading, tags under the Blog data to display for edit. Could someone please advise ? CSB link: https://codesandbox.io/s/practical-turing-x8ph7k?file=/src/App.js import "./styles.css"; import React, {… Read More How can I get data based on id and pass data text field for editting