score:17
Accepted answer
you're creating a new component class inside the render function.
part of react's diffing algorithm looks at the components, and if it sees you rendered a different type component in one spot it says "the structure is probably significantly different, so i won't waste time diffing the children". it throws out the node, and renders the new result to the dom.
move var filter = react.createclass...
somewhere it's only executed once, and it'll work fine.
Source: stackoverflow.com
Related Query
- Nested React <input> element loses focus on typing
- React useState hooks - Text input loses focus when typing if passing form through props
- Input key loses focus on typing and does not show input value in react
- Input loses focus after typing character React
- React - Input loses focus after typing 1 char in dynamic form
- React input text box loses focus after typing a character
- React MUI Formik Input loses focus after typing
- Why does a React input element lose focus when nested within a component?
- In React ES6, why does the input field lose focus after typing a character?
- React Hooks - Input loses focus when 1 character is typed in
- React text input loses focus when I type a letter
- React - input loses focus on keypress
- React semantic UI: How to set focus for input field of dropdown element
- React input loses focus after each keystroke
- reactjs input element loses focus after keystroke
- React Noob - onChange Element Loses Focus
- React - Internet explorer 11 input loses focus after first onchange
- Input loses focus when typing
- React Js input is losing focus when I try typing in it but only when onChange is added
- Losing focus on input field after typing a character in React with redux-form library
- Use react to focus input element with caret/text-cursor at end of text using onKeyDown
- Typing a React component that wraps a native input element
- Updating nested state in objects through an input element in React
- React loses focus on input after the first character
- React - Input in table row loses focus on input
- Typing in react form input causes focus loss and re-render
- React JS Input type text loses focus after keystroke
- why does focus loose from the html input element when i return input component from custom React Hooks?
- React strange behavior when calling as function and when calling as component, focus on input disapears after typing one character
- React input lose focus when typing
More Query from same tag
- how to update state to wait for a function to complete in React
- showing select on check reactjs
- What is the difference between "dynamic import" and regular import in react?
- Adding elements to list in Nextjs from a json response
- Pushing Sign Up & Login buttons to bottom of sidebar
- How do I manage state outside of React Final Form?
- Webpack Extract CSS for Production, Inline for Development
- useRef: state becomes undefined after rendering
- why adding this svg component to react doesn't work correctly?
- React - Why is binding this not required in this example?
- React re-rendering a component on prop update
- React children with typescript
- How would this React code look without React-hooks and with class components rather than functional components?(Button that open an additional window)
- The this keyword is undefined in React base class
- TypeError: Cannot read property 'score' of undefined in redux
- Smart array filtering JS
- How to pass data-attribute value to another function outside map function?
- Unhandled Rejecttion(Type Error): Cannot Read Property 'Status' Of Undefined
- React renderToString() Performance and Caching React Components
- React application built on top of firebase renders 404 on page refresh
- Encapsulate URL to fix 404 error on react js application page when we reload/refresh
- react-hook-form watch has wrong value after rendering select element
- MUI Custom Text Field loses focus on state change
- CSS modules in Create React App project aren't working properly
- Wait for function to complete before moving on
- whats wrong with this array map via typescript syntax
- XMLHttpRequest cannot load http://localhost:5000/api/users/signup due to access control checks
- Cannot GET / with webpack-dev-server
- How do I use the SpeedDial to upload a file?
- React state doesn't update with useState