React-sim
GitHub

Controls

Controls is how a user can interact with the simulation:

React-Sim provides 2 ways to build that interface.

  • A "fast" one, by passing certain props to a <Model /> component. You have access to building blocks to create a controls UI, styled sensibly, with minimal effort.
  • a "custom" one, using a wrapper. You bring in the component you want, styled the way you want, wrap it in withControls and it will have the methods and information needed to interact with the simulation.

TL;DR: by default, your Model will come with a default timer control that lets user start, stop, reset and go step by step in a simulation. That default timer stops at 100 ticks.

Edit this page on GitHub
Previous:
Tutorial
Next:
Default timer
React-SimGitHub