ReasonReact

ReasonReact

  • Docs
  • Try
  • Examples
  • Community
  • Blog
  • Languages iconEnglish
    • 日本語
    • Español
    • Français
    • 한국어
    • Português (Brasil)
    • Русский
    • 中文
    • 繁體中文
    • Help Translate
  • GitHub

›Core

Getting Started

  • What & Why
  • Installation
  • Intro Example

Core

  • Components
  • JSX
  • Event
  • Style
  • Router
  • ReactDOM
  • Refs in React
  • Testing components

Hooks

  • useState
  • useReducer
  • useEffect
  • Custom Hooks

ReactJS Idioms Equivalents

  • Invalid Prop Name
  • Props Spread
  • Component as Prop
  • Ternary Shortcut
  • Context
  • Error boundaries

FAQ

  • I'm Having a Type Error
  • I Really Need Feature X From ReactJS
  • I want to create a DOM element without JSX
Edit

Event

ReasonReact events map cleanly to ReactJS synthetic events. ReasonReact exposes a module called React.Event to help you work with events.

React.Event module contains all event types as submodules, e.g. React.Event.Form, React.Event.Mouse, etc.

You can access their properties using the React.Event.{{EventName}}.{{property}} method. For example, to access the target property of a React.Event.Form.t event, you would use React.Event.Form.target.

Since target is a JavaScript Object, those are typed as Js.t. If you're accessing fields on an object, like event.target.value, you'd use Melange's ## object access FFI:

React.Event.Form.target(event)##value;

Or, equivalently, using the pipe first operator:

event->React.Event.Form.target##value;

More info in the inline docs on the interface file.

← JSXStyle →