Where is the documentation to write an event handler for input text box?

Question

Originally I wanted to know:

How do I write a handler for this?

type state = string;
type action = | ChangeName(string)
let reducer = (_state, action) => switch action { | ChangeName(text) => text }
[@react.component]
let make = () => {
    let (state, dispatch) = React.usefReducer(reducer, "");
     /* What is the parameter type and how do I decode it? */
    let onChange = ??? => dispatch(ChangeText(????));  
    <input value=state onChange/>
}

Specifically, what is the parameter type for the punned onChange handler and how do I decode it?

Every reference I come across is for JS, which I'm having difficulty translating to Re.

EDIT The answer I found by scraping github:

let onChange = event => dispatch(ChangeName(ReactEvent.Form.target(event)##value));

Say I'd like to use another JSX element, where's the documentation? OR, is their a supposition that people coming to this from elsewhere have knowledge apriori? (I'm mostly comfortable with 'c').

score 1 · Accepted Answer · answered Mar 13 '21 at 05:20

You can get the types of all the DOM attributes from https://github.com/rescript-lang/rescript-react/blob/v0.10.1/src/ReactDOM.res

This file contains bindings to ReScript-React's subset of DOM attributes. It has:

onChange: ReactEvent.Form.t => unit

ReactEvent.Form module is declared at https://github.com/rescript-lang/rescript-react/blob/v0.10.1/src/ReactEvent.resi#L168

When looking for anything specific to ReScript-React, search that repo.

Looks like you have the correct code to handle the event now. Btw, you have in some places the variant constructor ChangeName and in others ChangeText, I assume the correct one is one of those. The compiler will of course catch this too :-)

It was a hurried example typed up on the fly: `ChangeName/Text` was meant to be the same variant. Thanks for the docs. — Jamie, Mar 13 '21 at 12:59

Where is the documentation to write an event handler for input text box?

1 Answers1