Skip to content

Tag: reactjs

Redux best practice to filter data

in the process of developing an application, I’m facing a question about whether I’m using Redux correctly. I have a fav:[] in which I add product objects and render their list. However, in order for the data not to be lost, I have to copy this fav:[] to favCopy:[] and only after that execute .filter Example code: I would like

Why is my component in React being called multiple times?

I am having an issue where my Listings component is running twice and I only want it to run once. I tried adding a counter below that would only run the code that grabs the data from the backend once but that did not work as you can see below it is still looping through the “grabListings” Function twice. I

how can you set a dynamic list in react?

I have a list like this My problem is, I want to set the maximum days of the list from a configuration so sort of like this I know this seems an easy thing to implement but Im new to react and cannot seem to find a similar question. Thanks Answer A common way is to use Array.prototype.push to populate

Change number format and get it as a number

I am using MUI and Formik to create form. I need to change numbers format in the all inputs: 1000.00 -> 1.000,00 A created function formatNumber(num) to do this, it works. But problem is that it returns string, and my API wait number (I can do nothing with that). I tried to use react-number-format but it also returns string. So

Accessing button using ref

I’m not able to access the button using ref. Below is my code sample, In I keeping the undefined for completeSubmissionButton. I’m not sure what’s the solution for it. Answer You can’t provide a ref to React component ,ref only work in a native html element so you need to pass your Button component into forwardRef fn

Is eslint pre-commit hook in CRA bootstrapped application required?

My react application is bootstrapped using CRA(react-scripts v4.0.0) and I want to add a code formatter (prettier to be specific) that must format the code before committing the changes to my git repo. I know that eslint is a dependency of react-scripts and linting is done using ‘eslint-webpack-plugin'(default enabled) inside the webpack configuration. Snippet from CRA github | React Scripts