score:1
Accepted answer
useref returns a mutable ref object whose .current property is initialized to the passed argument (initialvalue). the returned object will persist for the full lifetime of the component.
const ispressbackspaceref = react.useref(false);
const keydownpositionref = react.useref({});
const onkeydown = (e) => {
// this is wrong syntax
// this.keydownposition or let keydownposition
keydownpositionref.current = {
start: e.target.selectionstart,
end: e.target.selectionend
};
switch (e.key) {
case "backspace":
ispressbackspaceref.current = true; // this is wrong syntax ????
break;
default:
break;
}
};
const onchange = (e) => {
const { end } = keydownpositionref;
if (ispressbackspaceref.current) {
const length = end - e.target.selectionend;
alert(`you delete ${length} character`);
}
ispressbackspaceref.current = false;
};
score:0
in my experience you don't use the this keyword when working with function components. instead you use hooks like usestate. check the following video for getting started with hooks: https://www.youtube.com/watch?v=o6p86uwfdr0&ab_channel=webdevsimplified
Source: stackoverflow.com
Related Query
- React Dev Tools does not show Component Names or State Variable Names
- use of variable inside render function of react component
- Is it a bad practice to use state in a React component if the data will not change? Should I use a property on the class instead?
- Axios not updating state from API in function called on Click, but works on identical function on Component Mount in React
- React Function component setting state variable V/s using local variable
- The state variable returned after using useState react hook shows .map is not a function
- Should a React component use (fixed) values not on state or props?
- React Function Component Form not setting state variables?
- How do I add a JS state variable of 1 React component for use in other components?
- How to not mutate a prop variable used as state in a React component without a dummy variable?
- Variable not available outside of a function in a react component
- React function component parent state change does not re-render child component
- React Function Component use variable (not state)
- How to use a state value with map function to display repeat ui in react component
- State variable of react component does not change after fetch
- Passing a function as a callback to a React state created with hooks did not reflect new value of variable
- React Use State Hook error TypeError: setUser is not a function
- React Redux - Getting state to component - Uncaught TypeError: users.map is not a function
- React Hooks state variable not updated during setTimeout function
- setState for react function component not updated my state
- State is not getting updated in Function Component using useState in React
- React function component state not re-rendering?
- Function for updating state variable in class component in React
- The changes made to state variable in my react app is not updated to sub function calls
- Array not updating in React State in a function component with hooks
- accessing react state variable outside of a function in a component is printing null
- React Hook not able to use new state in the same function
- React global variable not being updated inside function that passing to children component
- React JSON mapped data. Trying to pass a setState variable from mapped function will not get the latest state on render
- React Child Component Not Updating After Parent State Change
More Query from same tag
- React Router doesn't match
- Logical error in React useEffect and conditional statement
- "Invalid Host Header" in When running React App
- How to add a NPM package to Remix route file
- React bootstrap Grid Columns displaying vertically
- React hooks: get state of useState inside a listener
- Can't trigger a search function for movie API project because useState is in a different component
- React chip input field
- Material UI Drawer not Opening even if state is True
- Inline style does not want to change when clicked on div
- How to pass the username to the sibling component?
- How to use same icon regular and solid type
- create-react-app is not working?
- Is there a way to use await keyword inside render in React code
- How to get multiple selected list items values in dropdown toggle?
- "Unauthorized: Full authentication is required to access this resource" when booting up the app
- ReactJS MobX and react-router v4 issue with url history
- React : Edit data and save on local storage
- How can I sort an array using immer?
- How to verify console.log was called in componentDidMount using Jest and Enzyme?
- firebaseApp is not defined in firebase file
- Share form data value from child component to parent component - React js
- Port redux state to component state when the component mounts (without need for GET request)
- How to convert animated SVG to a React functional component
- Property 'name' does not exist on type 'EventTarget' - React + TypeScript
- React.js Understanding setState
- Post request from React to Node/ Express is console logging an empty object
- How to return JSON objects from spring boot controller methods?
- Authentication with facebook google twitter using React.js
- React hooks - useEffect method keeps fetching