/r/ReactJS

How do I save an array of React Components into localStorage?

I have an array of React Components that looks like this: const [allSongs, setAllSongs] = useState([<Song/>,<Song/>]) but when I store it to localStorage with JSON.stringify and try to retrieve the list with JSON.parse, the array children have changed slightly, meaning I can’t map over the elements to display them anymore: localStorage.setItem(‘allSongs’, JSON.stringify(allSongs)) const deSerializedArr =… Read More »How do I save an array of React Components into localStorage?

need help with someone well familiar with Firebase(Admin SDK) React and Redux for a project to add admin features for user/application management

I’ve built a local Real-time chat application which utilizes firebase as the database, everything works fine since I’ve been referring to a tutorial and been referencing whatever I’m not sure about or wanted to change from other sites. However, I’m required to add admin functionality for managing users as well as some of the chat… Read More »need help with someone well familiar with Firebase(Admin SDK) React and Redux for a project to add admin features for user/application management

Pass data from child to parent in react typescript?

Child.tsx export const Child = (props) => { const [days, setDays] = React.useState(); const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => { props.setDays(event.target.value); }; return ( <TextField type=”number” label=”Days” value={days} onChange={handleChange} /> ); }; Parent.tsx export const Parent = () => { return <div>{days}</div>; }; How can I pass days variable to parent component in react typescript?… Read More »Pass data from child to parent in react typescript?

Bootstrap Element is a primitive component with utility classes and auto-completion a la “styled” inline props

just published a reusable and helpful react bootstrap utility component -> because adding classes should be easy and typed. I believe it should be helpful for any project that is using react & bootstrap, react-bootstrap or any other css based ui-library that is using bootstrap class-names conventions. more features are planned for future release. pr’s… Read More »Bootstrap Element is a primitive component with utility classes and auto-completion a la “styled” inline props

Route based code splitting questions

I have a site which was fully built out in Django and does server-side rendering. I want to switch the front-end to react by slowly adding react components/pages. I have found that code-splitting with react router is going to be the most efficient way (I think) to mix client-side react rendering and the old server-side… Read More »Route based code splitting questions

Question about Ant Design Rate component

I’m using Ant Design and I can’t get the rate component to show 1/2 star. I have a rating that shows a value of 4.6, but I’m still seeing 4 stars even with `allowHalf={true}`. Does anyone have experience with this component? submitted by /u/Neighborhood_Dry [link] [comments]

Manually iterating over an Array

Hi, I’m having a problem with arrays in React. Basically, inside my function component, I get my data inside a useEffect function, which I store in an array. The data consists of multiple test-questions with multiple answers, so it’s an array of questions, and inside eah question an array of answers. Everywhere I’ve looked, they… Read More »Manually iterating over an Array

Search functionality in React

Hello, so the problem is I have a search functionality everything works except that when an item has not been found, you see it should display the text “champion has not been found” but it is not. Where am I making a mistake import data from ‘./data.json’ import ‘./Champions.css’ import Skills from ‘./Skills’ import CloseIcon… Read More »Search functionality in React