Questions tagged [react-lifecycle]

313 questions
2
votes
2 answers

How to handle the props from Parent Component to child component to populate props data in the form for updation

I want to edit the guest data of my app. Why I click the edit button I take the ID, send it to GUEST class component and there I get the data from the state and then I send it to the input component (GuestForm). The problem is I am able to get the…
2
votes
1 answer

React + d3 multiple charts components with different data

I want to develop a 'monthly calendar' view with radial line charts for each day - displaying different data for each day. Right now I only used 3 days, just to try how would it work. The problem is that the graphs are getting attached to the…
2
votes
2 answers

How to rerender DOM after component's state was changed?

I am making a request to axios and receiving some data, which then I setState to my component's state: componentDidMount() { instance .get("https://bartering-application.firebaseio.com/myitems.json") .then(response => { …
2
votes
1 answer

React, React Hooks, Diffrent console.log print order inside useEffect

I am getting two diffrent orders of console.log prints based on wheater i am using a promise or not. The state: let [data,setData] = useState(1); When using promise: let asyncFunk = async () => { return "Asd"; }; useEffect(() => { …
Emperor
  • 335
  • 3
  • 11
2
votes
1 answer

Cancel Redux Action after Unmount

I want to cancel some functions after component unmount because it causes memory leak my code looks like this componentDidUpdate(prevProps) { if (prevProps.org.org !== this.props.org.org && this.mounted) { this.props.clearGraph(); …
Zouari Moez
  • 63
  • 1
  • 9
2
votes
2 answers

How to avoid unnecesary update in a stateless component with a React class-based component as a parent

I´m learning React and i found that React.memo() "is not working", because my component again re-render on every update that i do on the parent class-based component. But the problem is that props on component don´t change, at least it make sense…
2
votes
2 answers

ComponentDidMount function is called when I have `display: none`

I am conditionally rendering a modal component based on the display property. I need to implement toggle the body scroll functionality on component show/hide. See below implementation, Demo component
Kuldeep Bhimte
  • 961
  • 1
  • 10
  • 25
2
votes
1 answer

Invoke `componentDidUpdate` on form submit

I have a class component as follows: class App extends Component { constructor(props){ super(props); this.state = { abc: '', someQuery: '' } this.handleSubmit =…
AndrewL64
  • 15,794
  • 8
  • 47
  • 79
2
votes
1 answer

How to appropriately migrate from componentWillReceiveProps to getDerivedStateFromProps when 'this' is being used

I am trying to migrate my apps to do the React v16.3.* API, and it has been quite difficult to get rid of componentWillReceiveProps. I have components which are dependent on it and call the components other function in them. Because…
theJuls
  • 6,788
  • 14
  • 73
  • 160
2
votes
2 answers

React JS, How to only allow component to update once per second

I am having trouble limiting how often a component gets updated. Component A has a parent Component B. I want to have Component A only update once per second, as we are using socket IO to update live results, but when there are 100's of users we get…
DonohueSeth
  • 33
  • 1
  • 5
2
votes
3 answers

Which lifecycle hook should I make requests and immediately setState?

When my component mount I need to request it content from an API. In the docs: componentDidMount() is invoked immediately after a component is mounted. Initialization that requires DOM nodes should go here. If you need to load data from a…
Renan R.
  • 33
  • 4
2
votes
1 answer

React state resets back to initial value after component is mounted

My component is a header that contains primary and secondary navigation. So far I am dealing with primary navigation only, which chooses between large sections of the website. The state is lifted up to the main Header component, while the UpperMenu…
petajamaja
  • 520
  • 2
  • 9
  • 26
1
vote
2 answers

Why is array.length method one step behind the input in handleChange event handler

I'm trying to make an input filtered based list that only shows results when there are 10 or less objects, but the array.length is always lagging one step behind the input. const [countriesToShow, setCountriesToShow] = useState([]) const…
eartto
  • 11
  • 2
1
vote
1 answer

React state not changing after setState

class App extends React.Component{ constructor() { super(); this.state = { route: "Branches", adding: false, user: '', table: [], Branche: '', } } OnAccessBranch = (event) => { …
3idoudi
  • 25
  • 3
1
vote
0 answers

Implement an auto-resizing mechanism of editors

I would like to implement a resizing mechanism for Editor 2: The main purpose is to let the height of Editor 2 auto-resize so as to occupy the rest of the page after adding/removing Editor 1 and each resizing of the window. In the beginning, there…
SoftTimur
  • 5,630
  • 38
  • 140
  • 292