Common Pitfalls

Component does not update

keywords: doesn't update, no update, no change, not change

TWRComponents are considered pure functional components, which means they only update when their input changes.

Example 1:

function example(props){
  return <div>
    <TWRIndex tree='users'>
      <h1>{props.projectName}</h1>
      <ListUsers />
    </TWRIndex>
}

In the above example, if the props.projectName changes, the TWRIndex component will not register that change. Inorder for the following scenario to work properly, it has to be declared as a prop in TWRIndex.
Proper Example 1:

function example(props){
  return <div>
    <TWRIndex projectName={props.projectName} tree='users'>
      <h1>{props.projectName}</h1>
      <ListUsers />
    </TWRIndex>
}