CODEWITHSUNDEEP
javascriptreactjsreact-nativerenderingjsx
Omar Odaini
Omar Odaini

Reputation: 101

which part of react-native code re-renders every change?

I'm new to react-native and I was wondering about the running flow of it. For example:

  import React, { useState } from 'react';

  function Example() {
    const [count, setCount] = useState(0);

    return (
      <View>
          .
          .
          .
          .
      </View>
    );
  }

does the part before the return statement runs once or every render?
or every time the component gets called?
what if this component got called inside a return statement of another component , does the state gets reset every render?

Upvotes: 0

Views: 346

Answers (2)

Gabriel Amorim
Gabriel Amorim

Reputation: 399

There are two different types of components:

Stateful (class) components and Stateless (function) components (the one you are using).

The class components will only execute the render() method every time state changes and function will execute all the code every time you change the state inside it. You have to know wich is best for your use cases

Upvotes: 1

SHUBHAM JAIN
SHUBHAM JAIN

Reputation: 44

The part outside return will be executed only one time when we call the component.

If you want your code to run multiple times you can you useEffect that will run your code according to your need as you pass dependency variable in a array as second argument of useEffect. Yes as how many times you call any component is will create new states for that component, It will now affect previous state of that component if called. I think I covered you doubt is my short answer, If I left something Please let me know.

Upvotes: 1

Related Questions