I have a div and a textarea inside a parent div. I am trying to copy the scrollTop value of the textarea to the div so it moves in sync with the textarea scrolling. The problem seems to be when i add text into the textarea and then press enter for a new line, the div scrollTop value doesn’t seem
Tag: reactjs
Only update one item from ReactJS state items
Problem: I am trying to modify only one item from plan data using this.setState({ planData: { id: plan }}); but by doing so, all my other items become undefined. I found a workaround by adding all other items to my setState, but it doesn’t look good at all. Is there a way to only modify a single item fr…
Add Tooltip over a button
I’m trying to create a button which copies into clipboard content from variable using TypeScript and Material-UI. I tried this: Button to call above code: Do you know how I can add Tooltip https://mui.com/components/tooltips/ over the button to display message for successful copy when the text is copied…
react-select default value set but not highlighted
When I set the defaultValue in the react-select Component, it is correctly recognised and set, but is not highlighted in the select menu. defaultValue selected Not highlighted in the menu This is the defaultValue, and it’s correct: Perhaps it is because the value is an object? Does anyone have any sugge…
Why I’m getting CssSyntaxError of missing semicolon in Gatsby build?
I’m working on a Gatsby page using Material UI. The page design is almost complete, but when I’m finished, I get a strange build error on npm run build. I have no idea where this error is coming from, but I’ve spent several hours trying to resolve it with no success. Is anyone able to assist…
Socket.IO in React app bundled with Vite doesnt work (When bundled with Webpack it does)
I have a Create React App that I migrated to Vite. I use socket.io-client. Both versions of the app are exactly the same (simply copy/paste) except the bundlers. This is my websocket connection In the webpack version I can see in the network tab that socket.io is attempting to connect. But in the vite version…
CASL Authorisation in a React app “Can” conditions have no effect
I am trying to implement CASL Authorisation in a react app, I think there is something I am not quite understanding about how to implement it. The standard Can components seems to work with the basic CRUD actions, but I have not been able to get the conditions to have any effect. I think I am missing somethin…
How do I fix a “nodemon app crashed” error message?
I have just worked through chapter 2 of the book Full Stack React Projects, Second Edition. When I type into the Terminal yarn development to check my code, I get this error message: I have tried the following solutions: https://stackoverflow.com/a/54450694/14537132 https://stackoverflow.com/a/63298885/145371…
Mega menu div hides on hover | reactjs
I am creating a mega menu in reactjs framework for my ecommerce website. When ever i hover on list item it shows mega menu div but when i move cursor down the menu hides itself. Why it is not stay as it is ? Local state which controls the menu display state on onMouseEnter and onMouseLeave works well. Answer …
How to properly control focus and blur events on a React-Bootstrap InputGroup?
I have a single input element from react-bootstrap that will allow the user to change the field value and 2 buttons will appear, one to accept the changes and the other will cancel the changes leaving the original value in. I manage to control the focus and blur events by delegating the listeners to the wrapp…