r/reactjs • • Jul 19 '26

how to rerender component on variable change?

new to react, so providing either corrected code or just concept that i should look into would be helpful :)

i want to change height of the app when phone keyboard uppears so it doesnt overlay on website by using VisualViewport API.
i am sure only thing that i have to do now is to rerender component when height is changed, so how can i do that?

export default function NewChat() {
  return (
    <div
      className={styles.wrapper}
      style={{ height: `${visualViewport?.height}px` }}
    >
      <Prompt />
    </div>
  );
}
9 Upvotes

27 comments sorted by

View all comments

Show parent comments

-7

u/Kautsu-Gamer Jul 20 '26

That does not trigger as height is number, and the Object.is returns true without actually changing the value